Składnia tej właściwości jest oparta na tradycyjnej, skróconej notacji typograficznej, służącej do ustawiania wielu właściwości związanych z czcionkami.
Jak powiedział David M w komentarzach, jest to zgodne z tradycją składu polegającą na określaniu rozmiarów kroju pisma jako „ x pt na y pt” w celu oznaczenia rozmiaru glifu na wysokości wiersza.
Ale przykład w twoim pytaniu jest w rzeczywistości błędny i zostałby zignorowany przez przeglądarkę: możesz łączyć tylko te dwie właściwości w fontnotacji skróconej i musisz określić co najmniej zarówno rozmiar czcionki, jak i rodzinę. font: 100%/120%;Dlatego samo pisanie nie wystarczy; możesz jednak dodać ogólne nazwisko rodziny, aby było ważne, np .:
Ma to na celu odzwierciedlenie starej składni składu, w której trzeba ustawić czcionkę na przykład „10 pkt na 12 pkt” lub „10 pkt / 12 pkt”.
David M
1
Właściwie używam tego całkiem sporo. Projektant, z którym pracuję, zawsze odnosi się do rozmiaru jako na przykład „14 na 22”. Włożyłem go przypadkiem pewnego dnia i byłem zaskoczony / zadowolony, gdy zadziałał.
Dylan Lukes
1
szybki numerek: czy ten format również nie wymaga określenia rodziny czcionek? Moje przeglądarki ignorują tę właściwość: font: 12px / 16px; ale akceptując to: font: 12px / 16px sans-serif; To zachowanie jest również udokumentowane tutaj
kumarharsh
@Harsh Tak, rodzina (wraz z rozmiarem) jest minimalnie wymagana dla fontnieruchomości skróconej, jak widać w oficjalnej definicji .
Konrad Rudolph
Dziękuję za wyjaśnienie. Być może możesz zaktualizować odpowiedź (lub pytanie), ponieważ jest to nieco mylące, ponieważ zwykły czytelnik może założyć, że tylko deklaracja SIZE / LINE_HEIGHT będzie działać.
kumarharsh
15
Konrad to dostał, ale istnieje wiele skrótowych właściwości CSS , takich jak ta, których możesz użyć do skracania arkuszy stylów. Niektóre z nich wyglądają trochę tajemniczo, jeśli ich nie znasz.
Jednak większość skrótów odnosi się do powiązanych właściwości stylu (np border-*.). David dał dobre wyjaśnienie w komentarzach do mojej odpowiedzi. Jeśli chodzi o tajemnicze skróty: z pewnością prawdziwe, ale tak cholernie przydatne i całkiem łatwe do nauczenia.
font-size
nie akceptuje ukośnika. Poprawna właściwość tofont
.Odpowiedzi:
To faktycznie ustawia dwie właściwości i jest równoważne z:
font-size: 100%; line-height: 120%;
Cytując oficjalną dokumentację :
Jak powiedział David M w komentarzach, jest to zgodne z tradycją składu polegającą na określaniu rozmiarów kroju pisma jako „ x pt na y pt” w celu oznaczenia rozmiaru glifu na wysokości wiersza.
Ale przykład w twoim pytaniu jest w rzeczywistości błędny i zostałby zignorowany przez przeglądarkę: możesz łączyć tylko te dwie właściwości w
font
notacji skróconej i musisz określić co najmniej zarówno rozmiar czcionki, jak i rodzinę.font: 100%/120%;
Dlatego samo pisanie nie wystarczy; możesz jednak dodać ogólne nazwisko rodziny, aby było ważne, np .:font: 100%/120% serif;
źródło
font
nieruchomości skróconej, jak widać w oficjalnej definicji .Konrad to dostał, ale istnieje wiele skrótowych właściwości CSS , takich jak ta, których możesz użyć do skracania arkuszy stylów. Niektóre z nich wyglądają trochę tajemniczo, jeśli ich nie znasz.
źródło
border-*
.). David dał dobre wyjaśnienie w komentarzach do mojej odpowiedzi. Jeśli chodzi o tajemnicze skróty: z pewnością prawdziwe, ale tak cholernie przydatne i całkiem łatwe do nauczenia.