How to set font text in CSS

When it comes to font properties we all think of the text, then this article will take everyone a good understanding of the CSS for the text settings, or for the text style settings to learn.

CSS can set the style of the text CSS font has what

Font Text directory

Size of CSS text

The color of the text

Underline the DIV CSS text

DIV CSS Text interval

Font for CSS text

Line spacing between lines of text

CSS font style (italic)

CSS Word Bold Way

Div+css English text, letter case

DIV+CSS development in Set font common CSS Properties word English CSS font-can go to CSS manual view more detailed CSS text knowledge
Font, font-family (font), font-size (word size), Font-style (Word style), font-weight (CSS Bold), text-decoration (underline), Font-variant (letter case), Text-transform (case in English), letter-spacing (interval)

Next, we explain through the CSS text control method

First, the font size used to Font-size

First set the value of Font-size to 36px, the following result shows a larger font.

Second, the color of the text

Text color use the CSS color Color property to set the text style color to red by using the color style value

Third, CSS to control the text of the underline method of CSS font, used to text-decoration

Text-decoration can enter the CSS manual to learn the corresponding values, you may also want to learn about CSS links, css hyperlink style, CSS underline

Four, the spacing of the text-into the detailed CSS word spacing to understand

Font of text-CSS style properties font-family

General font-family font can be with the common "Arial", "New song Body", "black body", note that can not set their own font style, although in their own computer may set the font can be displayed, but the general computer users have not added fonts, so here font can only be set common, The system comes with a font, and cannot set its own installed font, Chinese font to Unicode encoding.
The computer comes with the font, and often set the text font has black body, new Arial, song body, Arial, Helvetica, Sans-serif, etc.

Six, the line spacing between the text

Upper and lower line spacing use to CSS text set Word line-height, here set line-height:50px;

You can see the demo CSS font text field "I was shown by CSS control text style." "The distance from the upper and lower text is implemented by CSS Line-height. Maybe you need to know the difference between BR and P.

Seven, font style (italic)

Text italic used in CSS style Font-style tag settings such as Font-style:italic, of course you can use the <em> tag to change the text to italic

Eight, the word bold way

Text bold can be directly to the need to add text before <b> text plus </b> or <strong></strong> to achieve, the text bold, here you can use CSS to control the text bold. Here to use the font-weight to set up such as Font-weight:bold;

Here the value of Font-weight can be a value of 100-900, the larger the font size, if the value of bold is normal bold, with the use of B or strong consistent effect, B and strong bold difference.

Nine, English text, letter case CSS Font

Use the full size of font-variant letters in CSS, such as Font-variant:small-caps, and select Case Text-transform such as text-transform:capitalize; start with the first letter capitalized.

Text-transform Grammar Text-transform:none | Capitalize | Uppercase | lowercase
Parameters:
None: No conversion occurs
Capitalize: Converts the first letter of each word to uppercase, and the remaining no conversions occur
Uppercase: Convert to uppercase
Lowercase: Convert to lowercase

Font-variant Grammar Font-variant:normal | Small-caps

Parameters:

Normal: Regular font
Small-caps: Small Caps font

Believe that you have seen these cases you have mastered the method, more wonderful please pay attention to the PHP Chinese network other related articles!

Related reading:

How to use the transform gradient property in CSS3

Summary of common units in CSS

How to use the CSS3 attribute selector to replace the function of JS