Tips for CSS to control text in a Web page

css| Skills | control | web | chinese control the style of text

The style of control text includes two parts, such as text capitalization and text decoration.

　　1. Writing case

Text case so that the designer of the Web page does not have to fill in the text when the text is completed, but you can enter the finished, and then the local text to be set to case.

The basic format is as follows:

Text-transform: Parameters

Parameter value range:

Uppercase: All text capitalization display

lowercase: All text lowercase display

capitalize: Capitalize the first letter of each word

None: Do not inherit the text deformation parameters of the mother

Note: Inheritance means that an identifier for an HTML inherits from an argument that contains its own identifier.

　　2. Text decoration

The main purpose of the text decorations is to change the underline when the browser displays text links.

The basic format is as follows:

Text-decoration: Parameters

Parameter value range:

Underline: Underline text

overline: Underline text

Line-through: Delete lines for text

blink: Make text blink

None: Do not show any of the above effects

　　Control the style of text

Control text styles include word distance, letter distance, text spacing, text horizontal alignment, and text indented six sections vertically.

　　1. Word Spacing

Word spacing refers to the distance between each word in English, excluding Chinese characters.

The basic format is as follows:

Word-spacing: Interval distance

Distance between the values: points, EM, pixes, in, CM, MM, PC, ex, normal and so on.

　　2. Letter Spacing

Letter spacing refers to the distance between English letters, function, usage, and the setting of parameters and the spacing of words is very similar.

The basic format is as follows:

Letter-spacing: Letter Spacing

　　3. Line Spacing

Line spacing refers to the vertical distance between the two lines of baseline. Generally speaking, the English five-grid exercise book, the third line from the top down is the computer's thought that the line of the baseline.

The basic format is as follows:

Line-height: Distance between rows

Distance between rows:

• Number with no units: 1 as the base, equal to 100% of the proportional relationship

• Number with length units: whichever is the specific unit

• Proportional relationship

Note: If the text has a large font size and the line spacing is relatively small, the two lines of text may overlap.

　　4. Text Horizontal alignment

Text horizontal alignment controls the horizontal alignment of text, and does not just refer to text content, but also to the alignment of settings for pictures and image data.

The basic format is as follows:

Text-align: Parameters

The value of the parameter:

left: left-aligned

right: Align Right

Center: Center Alignment

Justify: Relative right and left alignment

It should be noted, however, that Text-alight is a block-level attribute and can only be used in identifiers such as < p>, < blockquqte>, < ul>, < h1>~< h6>, and so on.

　　5. Text Vertical alignment

The vertical alignment of text should be relative to the position of the text parent, not the text being vertically aligned in the Web page. For example, a table cell has a paragraph of text, so the vertical center of the text is measured against the cell, that is, the text will appear in the center of the cell, not the entire page.

The basic format is as follows:

Vertical-align: Parameters

Parameter values:

Top: Top alignment

Bottom: Bottom alignment

text-top: Align relative to top of text

text-bottom: Align relative to text bottom

Baseline: Baseline alignment

Middle: Center Alignment

Sub: The form shown below

Super: The above standard form shows

　　6. Text Indent

Text indentation enables text to be displayed in areas with a narrower default value, mainly for first-line indentation in Chinese plate, or for indented text and notes for large paragraphs.

The basic format is as follows:

Text-indent: Indent Distance

Indent Distance Value:

• Number with length units

• Proportional relationship

However, it should be noted that when using proportional relationships, some people think that the default ratio of browsers is relative to the width of the paragraph, in fact, this is not the case, the entire browser window is the browser's default reference.

In addition, Text-indent is a block-level attribute and can only be used in identifiers such as < p>, < blockquqte>, < ul>, < h1>~< h6>, and so on.