Além de planos de fundo e cores bonitos, as configurações de fonte também são uma parte importante do web design. Fontes adequadas não apenas tornarão a página mais bonita, mas também melhorarão a experiência do usuário. CSS fornece uma série de propriedades para definir estilos de fonte de texto, como alterar fontes, controlar tamanho e espessura da fonte e assim por diante.
Aprendendo as propriedades CSS acima, podemos definir a fonte, tamanho, estilo, itálico, negrito, etc. para o texto em HTML.
1. família de fontes
O atributo font-family é usado para definir a fonte de um elemento. A fonte é Song, Kai, etc.
Através do atributo font-family, várias fontes podem ser declaradas ao mesmo tempo e as fontes são separadas por vírgulas. De acordo com o princípio de chamada de fonte, a primeira fonte será chamada primeiro. Se não for encontrada, a próxima fonte será tentada. Se nenhuma for encontrada, a fonte padrão será chamada.
Exemplo:
Por exemplo, defina a fonte do texto na seguinte tag <p>:
<p>programação dotcpp</p>
Você pode usar um seletor de tags e defini-lo no atributo font-family:
p{família de fontes:'TimesNewRoman','sans-serif',宋体,楷体;}Ao declarar fontes, devemos declarar as fontes inglesas e chinesas separadamente, e a declaração das fontes inglesas deve ser anterior às fontes chinesas. Porque a maioria das fontes chinesas contém letras em inglês, mas elas não são muito bonitas, enquanto as fontes em inglês não contêm caracteres chineses. Portanto, se não quisermos usar fontes chinesas para exibir o inglês, devemos nos lembrar de declarar as fontes em inglês primeiro. Aquele declarado primeiro será chamado primeiro.
Fontes em inglês comumente usadas: Arial, Helvetica, Tahoma, Verdana, Lucida Grande, Georgia, etc.
Fontes chinesas comumente usadas: SimSun, SimHei, Microsoft YaHei, FangSong, KaiTi, etc.
2. estilo de fonte
font-style define o estilo da fonte Você pode definir a fonte para itálico, itálico ou normal. As fontes itálicas são geralmente definidas como uma fonte individual dentro de uma família de fontes.
Os valores de atributos comuns para este gênero são os seguintes:
3.peso da fonte
O atributo font-weight define o negrito da fonte usada no texto do elemento exibido.
Os valores de propriedade comuns para esta propriedade são os seguintes:
4. tamanho da fonte
O atributo font-size é usado para definir o tamanho da fonte. A unidade comumente usada é px, que é pixels.
px é a abreviatura de Pixel, que é a menor unidade de imagens ou gráficos digitais que pode ser exibida e representada em um dispositivo de exibição digital. Pixel é a unidade lógica básica em gráficos digitais, e pixel também é chamado de elemento de imagem.
5. variante de fonte
O atributo font-variant pode converter as letras minúsculas do inglês no texto em versalete (as letras maiúsculas convertidas são semelhantes em tamanho às letras minúsculas pré-conversão, por isso são chamadas de versalete). Os valores opcionais para o atributo font-variant são os seguintes:
6. fonte
O atributo font é usado para definir todos os atributos de fonte em uma declaração, com espaços separando cada atributo. Ou seja, o atributo de abreviatura abrangente dos atributos acima.
Se usarmos o atributo font para definir o estilo da fonte, a ordem de configuração é: estilo da fonte, variante da fonte, espessura da fonte, tamanho da fonte/altura da linha, família da fonte. Não é necessário definir nenhum dos valores e as propriedades não definidas usarão seus valores padrão.