2

I see this particular font css applied to


font: 400 50px/60px "minion-pro",times,serif;

an element. I want to understand what is 400 whats meaning of 50px/60px and which of the three fonts "minion",times or serif gets applied.

4

4 回答 4

5

you can write like this:

div{
 font-weight:400;
 font-size:50px;
 line-height:60px;
 font-family:"minion-pro",times,serif;
}

In the font-family they are fall back fonts . fallBack fonts means if "minion-pro" is not in user computer then it's pick times instead of "minion-pro" & if there times is not in the user computer then it's pick serif font-family.

于 2012-04-16T06:04:49.027 回答
1

It can be rewritten like this:

font-weight: 400;
font-size: 50px;
line-height: 60px;
font-family: "minion-pro",times,serif;

So 400 is the weight of the font, 50px/60px means 50px font size, with 60px line-height. The first available font will be applied which exists on the computer which is displaying the webpage.

http://www.w3.org/TR/CSS21/fonts.html#propdef-font

于 2012-04-16T06:10:40.310 回答
1

This is the shorthand font property.

font: style variant weight size / height family1, family2,...;

is short for

font-style : style;
font-variant: variant;
font-weight: weight;
font-size: size;
line-height: height;
font-family: family1, family2,...;

The font-family property takes a prioritized list:

The property value is a prioritized list of font family names and/or generic family names

The browser will use the first font-family that's available. There are some generic names like sans-serif, serif and monospace.

EDIT: Also note that font-weight:400 is the same as font-weight: normal.

See also:

于 2012-04-16T06:10:53.847 回答
0

I can answer for the font, they'll be used by order of availability (some browser might not render them or know them) so 1st minion then times then serif. For the 400 I don't know at the moment

于 2012-04-16T06:06:10.540 回答