Introduction to different attributes of font in css

This article brings you an introduction to the different attributes of font (font) in CSS. It has certain reference value. Friends in need can refer to it. I hope it will be helpful to you.

Abbreviation order: style-variant-weight-size/line-height-family

eg:

p{font:italic bold 12px/30px Georgia,serif;}

Note: font-size and font-family Value is required.

Introduce each attribute in order:

1. font-style: normal (default); italic (italic); oblique (inclined); inherit;

italic It is very similar to the oblique style, but oblique has poor compatibility.

2. font-variant: normall (default); small-caps (font that displays small capital letters; means that all lowercase letters will be converted to uppercase, but all letters using small-caps are the same as Compared with the rest of the text, the font size is smaller); inherit;

3. font-weight: normal (default, 400); bold (700); bolder; lighter; inherit;

4 , font-size: medium (default, medium); smaller (smaller size than the parent element); larger (larger size than the parent element); length; %; inherit;

Which is the same as medium The parallel attributes are: xx-small, x-small, small, meidium, large, x-large, xx-large.

5. font-family

eg:

p｛font-family:"Times New Roman",Time,serif;｝

Writing: (1) Each value is separated by commas (2) If the font name contains spaces, it must be enclosed in double quotes. When using the "style" attribute in html, use single quotes.

Note: (1) On a computer screen, sans-serif fonts are considered easier to read than serif fonts. (2) Font-family includes family-name (specified series) and generic-family (general font family). The use of a particular font depends entirely on the availability of that font on the user's machine, so using a generic font family name as a fallback is highly recommended.

Related recommendations:

div css How to define font bold, font font_html/css_WEB-ITnose

CSS: Reference font files and use of font icons_html/css_WEB-ITnose

The above is the detailed content of Introduction to different attributes of font in css. For more information, please follow other related articles on the PHP Chinese website!