Learn Web page making technology in detail CSS text properties

css| Web page

Text property:

The properties here affect the display of text in the Web document.

Text-indent property Describes how the text is indented:

Property name: ' Text-indent '
Property values: <length> | <percentage>
Initial value: 0
Fit object: Container element
Whether to inherit: Yes
Percent Note: Depends on the width of the parent element

The following example shows a paragraph with an indentation value of 3em:

P {Text-indent:3em}

The Alignment property indicates how the text is aligned:

Property name: ' Alignment '
Property value: Left | Right | Center | Justify
Initial value: According to User defined
Suitable object: Block-level elements
Whether to inherit: Yes
Percent remark: prohibited

The Text-decoration property describes how to modify text:

Property name: ' Text-decoration '
Property value: None | [Underline | | overline | | line-through | | blink]
Initial value: None
Fit objects: all elements
Whether to inherit: no (see clarification below)
Percent remark: prohibited

Property value meanings are:
Underline: Underline.
Overline: Underline.
Line-through: Delete line.
Blink: Flashing (as with the function of the blink tag in navigator)

The Text-shadow property can add shadow effects to Text:

Property name: ' Text-shadow '
Property value: None | <color> [, <color>]*
Initial value: None
Fit objects: All
Whether to inherit: No
Percent Note: Valid only when describing transparency

For example:

P {Text-shadow:black}

The above example displays a black shadow at the bottom right of the text, and the shadow increases the area of the box.

Letter-spacing property indicates the spacing of text: Property name: ' Letter-spacing '

Property value: Normal | <length> | Auto
Initial value: Normal
Fit objects: all elements
Whether to inherit: Yes
Percent remark: prohibited

For example:

BLOCKQUOTE {Letter-spacing:0.1em}

The Word-spacing property indicates the spacing of words in the text:

Property name: ' Word-spacing '
Property value: Normal | <length>
Initial value: Normal
Fit objects: all elements
Whether to inherit: Yes
Percent remark: prohibited

For example:

H1 {Word-spacing:1em}

The Text-transform property can display text in box in the specified uppercase or lowercase format:

Property name: ' Text-transform '
Attribute value: Capitalize | Uppercase | lowercase | None
Initial value: None
Fit objects: all elements
Whether to inherit: Yes
Percent remark: prohibited

The attribute value means:
Capitalize: Capitalize the first letter of every sentence in box.
Uppercase: Turn all the letters in box into uppercase.
Lowercase: Turn all the letters in box to lowercase.

The White-space property describes how to display spaces in the text, in HTML, where spaces are omitted, that is, you can enter a paragraph mark at the beginning no matter how many spaces are invalid, there are two ways to enter a space, a direct input space code "", or use <pre > tags, CSS also developed a similar to the pre properties:

Property name: ' White-space '
Property value: Normal | Pre | NoWrap
Initial value: Normal
Fit object: Container element
Whether to inherit: Yes
Percent remark: prohibited

For example:

PRE {White-space:pre}
P {White-space:normal}