The problem of Font property in CSS and its solution

Attribute definitions and usage instructions

The font shorthand property sets all font properties in a declaration.

The properties you can set are (in order):

"Font-style font-variant font-weight font-size/line-height font-family"

The font size and font family values are required. If another value is missing, the default value is inserted, if there is a default value.

Font property issues in CSS, fonts and Line Heights

The first set is Font-size, the back is line-height; just under chrome test, write font:10px/1.5em separately; is invalid. But add font-family to the back. For example: Font:10px/1.5em Arial,verdana, or written font:10px/1.5em "", is also valid. The shorthand property in front of the font may not be written, but the Font-family property must be written otherwise it will be invalid. The complete font shorthand attribute Font:italic small-caps bold 12px/1.5em Arial,verdana; It is recommended that you simply set the row height and font size without using the shorthand attribute. You can refer to Bootstrap's recommendations for using shorthand properties.

Why does font writing in CSS not work

body{font:62.5% Arial, Helvetica, Sans-serif, "Song Body";}. Nav li{font:1.6em/54px;} " Font:1.6em/54px "doesn't work.

To change the font:1.6em/54px to Font:54px/1.6em, it is advisable to write complete. Shorthand Order: Font-style | Font-variant | Font-weight | Font-size | Line-height | Font-familyfont-style:italic;font-variant:small-caps;font-weight:bold;font-size:12px;line-height:1.5em; Font-family:arial,verdana; shorthand format: font:italic small-caps bold 12px/1.5em Arial,verdana; Description: Abbreviated Font-size and Line-height, Only by Slash/composition