Fontes seguras na Web em CSS | Explicado

As fontes funcionam como marcas comerciais de qualquer site, pois essas fontes oferecem uma aparição visual esplêndida a qualquer site. Sempre há uma perspectiva de que as fontes que funcionam magnificamente em uma plataforma/dispositivo podem não ser eficazes para outras plataformas. Portanto, as fontes seguras à web são sempre a primeira escolha do desenvolvedor.

As fontes acessíveis a quase todos os dispositivos e suportados pela maioria dos navegadores são referidos como fontes seguras na Web. Essas fontes são instaladas globalmente em todos os navegadores e dispositivos. Esta redação apresentará algumas fontes notáveis ​​para a Web, juntamente com suas famílias de fontes genéricas:

• Serif (Times New Roman, Geórgia)
• Sem serifa (Arial, Calibri, Helvetica)
• Cursivo (Script mt)
• Monospácia (Correio)

Então vamos começar!

Serif

As fontes que pertencem à família serif têm pequenos golpes decorativos na beira da letra.

Times New Roman

Uma fonte extremamente popular que pertence à família Serif e é usada como fonte principal para aplicativos do Windows. É mais comumente usado na tese de pesquisa, artigos e mídias impressas, como jornais.

Exemplo

O snippet abaixo dado permitirá que você entenda como usar o Times New Roman Font em HTML/CSS

Html

Um exemplo de vezes novas fontes romanas

CSS

P
Fonte-família: 'Times New Roman', Serif;

A seguir, será a saída resultante do trecho acima:

Geórgia

É uma fonte elegante que pertence à família Serif e é muito legível em vários tamanhos de fontes, considerada a opção perfeita para designs móveis responsivos:

Html

Um exemplo de fontes da Geórgia

CSS

P
Font-Family: Georgia, Serif;

O trecho de código acima mostra a seguinte saída:

Sem serifa

Ao contrário das fontes serif, elas não têm nenhum golpe em vez disso, essas fontes são letras simples. As fontes de San-Serif são consideradas fontes facilmente legíveis em comparação com qualquer outra família de fontes.

Arial

As fontes Arial e seus familiares são considerados as fontes da web mais seguras e a razão por trás disso é muito simples eu.e. As fontes ARIAL estão facilmente disponíveis em todas as plataformas/sistemas operacionais.

Exemplo

Considere a peça de código abaixo que descreve como as fontes ariais parecem:

Html

Um exemplo de fontes ariais

CSS

P
Fonte-família: Arial, sem serrif;

No código acima, escrevemos "San-Serif" como o fallback, porque nenhuma fonte é cem por cento. A seguir, será o resultado do código acima:

helvética

É uma das fontes mais usadas que pertencem à família Sans-Serif. É considerado a fonte comercial e é muito popular entre os designers:

Html

Um exemplo de fontes Helvetica

CSS

P
Fonte-família: Helvetica, sem serrif;

Os trechos acima do rumo exibem o seguinte resultado:

Calibri

É a fonte Microsoft padrão desde o lançamento do MS Office 2007 e tem um visual muito elegante.

Html

lt; p> um exemplo de fontes de calibri

CSS

P
Fonte-família: calibri, sem serrif;

O trecho de código acima produz o seguinte resultado:

Script mt

É uma das fontes mais populares da família cursiva e é muito semelhante à caligrafia humana

Html

Um exemplo de fontes mt de script

CSS

P
Fonte-família: 'Script mt', cursiva;

A saída do snippet de código acima aparecerá assim:

Courier novo

É uma fonte muito usada da família Monospace, que é usada principalmente para mostrar os códigos de programação e, além disso, a maioria dos e -mails usou o Courier New como uma fonte padrão.

Html

Um exemplo de fontes mt de script

CSS

P
Font-Family: 'Courier New', Monospace;

O trecho acima do dado gera a seguinte saída:

Conclusão

Fontes seguras à Web são fontes universalmente instaladas e podem ser exibidas com segurança em qualquer dispositivo. Existem inúmeras fontes seguras na Web de famílias Sans-Serif, Serif, Monospace e Cursive disponíveis em quase todos os dispositivos. Neste artigo, aprendemos sobre algumas fontes amplamente usadas na Web e realizamos alguma implementação prática dessas fontes em vários campos.