A sintaxe dessa propriedade é baseada em uma notação abreviada de tipografia tradicional para definir várias propriedades relacionadas a fontes.
Como David M disse nos comentários, ele reflete a tradição tipográfica de especificar os tamanhos dos caracteres como " x pt em y pt" para indicar o tamanho do glifo na altura da linha.
Mas o exemplo na sua pergunta está realmente errado e seria ignorado pelo navegador: você só pode combinar essas duas propriedades na fontnotação abreviada e deve especificar pelo menos o tamanho da fonte e a família. Simplesmente escrever font: 100%/120%;não é suficiente; você pode adicionar um nome de família genérico para torná-lo válido, por exemplo:
É para espelhar a sintaxe antiga de digitação, onde você teria a fonte definida como, por exemplo, "10pt em 12pt" ou "10pt / 12pt".
31909 David M
1
Na verdade, eu uso isso bastante. O designer com quem trabalho sempre se refere ao dimensionamento como, por exemplo, "14 acima de 22". Eu o coloquei por acidente um dia e fiquei surpreso / contente quando funcionou.
Dylan Lukes
1
uma rapidinha: esse formato também não exige que a família de fontes seja especificada? Meus navegadores estão ignorando esta propriedade: fonte: 12px / 16px; mas aceitando isso: fonte: 12px / 16px sans-serif; Esse comportamento também está documentado aqui
kumarharsh
@Harsh Sim, uma família (juntamente com um tamanho) é minimamente necessária para a fontpropriedade taquigráfica, como você pode ver na definição oficial .
21913 Konrad Rudolph
obrigado pelo esclarecimento. Talvez você possa atualizar a resposta (ou a pergunta), pois isso é um pouco enganador, pois um leitor casual pode assumir que apenas uma declaração SIZE / LINE_HEIGHT funcionaria.
precisa saber é o seguinte
15
O Konrad conseguiu essa, mas existem muitas propriedades de abreviação de CSS como essa que você pode usar para reduzir suas folhas de estilo. Alguns deles parecem um pouco enigmáticos, se você não os conhece.
Porém, a maioria das atalhos aborda propriedades de estilo relacionadas (por exemplo border-*). David deu uma boa explicação nos comentários à minha resposta. Quanto a taquigrafia ser enigmática: certamente verdadeira, mas muito útil e fácil de aprender.
font-size
não aceita a barra. A propriedade correta éfont
.Respostas:
Na verdade, isso define duas propriedades e é equivalente a:
Para citar a documentação oficial :
Como David M disse nos comentários, ele reflete a tradição tipográfica de especificar os tamanhos dos caracteres como " x pt em y pt" para indicar o tamanho do glifo na altura da linha.
Mas o exemplo na sua pergunta está realmente errado e seria ignorado pelo navegador: você só pode combinar essas duas propriedades na
font
notação abreviada e deve especificar pelo menos o tamanho da fonte e a família. Simplesmente escreverfont: 100%/120%;
não é suficiente; você pode adicionar um nome de família genérico para torná-lo válido, por exemplo:fonte
font
propriedade taquigráfica, como você pode ver na definição oficial .O Konrad conseguiu essa, mas existem muitas propriedades de abreviação de CSS como essa que você pode usar para reduzir suas folhas de estilo. Alguns deles parecem um pouco enigmáticos, se você não os conhece.
fonte
border-*
). David deu uma boa explicação nos comentários à minha resposta. Quanto a taquigrafia ser enigmática: certamente verdadeira, mas muito útil e fácil de aprender.