O melhor tutorial CSS3 Font em 2024. Neste tutorial você pode aprender Regras CSS3 @ font-face,Suporte a navegadores,Você precisa usar o tipo de letra,Exemplos,Use texto em negrito,Exemplos,CSS3 descrição da fonte,
As versões anteriores do CSS3, web designers tiveram que usar no computador do usuário já está instalado fontes.
Use CSS3, web designers podem usar qualquer fonte ele / ela gosta.
Quando você encontrar o arquivo que você deseja usar a fonte, o arquivo de fonte irá simplesmente ser incluído no site, ele será baixado automaticamente para as necessidades dos utilizadores.
Fonte de sua escolha na nova versão no CSS3 @ descrição da regra font-face.
Suas fontes "próprios" são definidos na regra font-face CSS3 @.
Números na tabela representam o primeiro navegador a suportar o número da versão da propriedade.
属性 | |||||
---|---|---|---|---|---|
@font-face | 4.0 | 9.0 | 3.5 | 3.2 | 10.0 |
Internet Explorer 9 +, Firefox, Chrome, Safari e Opera WOFF suporte (Web Open Font Format) fontes.
Firefox, Chrome, Safari e Opera .ttf suporte (fontes True Type) e .otf (OpenType) font tipo de fonte).
Chrome, Safari e Opera também oferece suporte a fontes SVG / entrou em colapso.
Internet Explorer também suporta fontes OpenType (EOT incorporado).
Nota: Internet Explorer 8 e versões anteriores não suportam a nova regra @ font-face.
Na regra font-face nova @, você deve primeiro definir o nome da fonte (como myFirstFont), e, em seguida, apontar para o arquivo fonte.
Dica: URL utilizar fontes minúsculas, letras maiúsculas em IE irá produzir resultados inesperados |
Para usar a fonte para o elemento HTML, para referir-se o nome da fonte (myFirstFont) por font-family:
Você deve adicionar outra regra @ font-face que contém o texto em negrito:
O arquivo "Sansation_Bold.ttf" é um outro arquivo de fonte que contém negrito Sansation.
Usando este texto navegador tempo para a família da fonte "myFirstFont" deve ser processado como negrito.
Então você pode ter muitos da mesma regra font-face de fonte @.
A tabela a seguir lista todos a descrição da fonte e do interior da definição de regra @ font-face:
descritores | valor | descrição |
---|---|---|
font-family | nome | Necessário. Disposições do nome da fonte. |
src | URL | Necessário. arquivo de fonte URL definida. |
font-stretch |
| Opcional. Definir como desenhar a fonte. O padrão é "normal". |
font-style |
| Opcional. Define o estilo da fonte. O padrão é "normal". |
font-weight |
| Opcional. Um peso fonte personalizada. O padrão é "normal". |
unicode-range | unicode-range | Opcional. fonte personalizada intervalo de caracteres Unicode suporte. O padrão é "U + 0-10FFFF". |