text format


Text Color

The color property is used to set the color of the text.

Colors are most commonly specified via CSS:

  • ## Hexadecimal value - e.g.: #FF0000

  • An RGB value - such as: RGB(255,0,0)

  • ##Color The name - such as: red


Alignment of text


The text alignment property is Used to set the horizontal alignment of text.

Text can be centered or aligned to the left or right, justified on both ends.

When text-align is set to "justify", each line Is expanded to equal width and the left and right margins are aligned (like magazines and newspapers).


Text decoration

The text-decoration property is used to set or delete text decoration.

From a design perspective, the text-decoration attribute is mainly used to remove the underline of the link (example on the right). You can also decorate the text like this:

h1 {text-decoration:overline;}

h2 {text-decoration:line-through;}

h3 {text-decoration:underline;}

Rendering:

1.jpg


Text Transform


The text-transform attribute is used to specify the content in a text uppercase and lowercase letters.

can be used to make all words uppercase or lowercase, or to capitalize the first letter of each word.

Example:

p.uppercase {text-transform:uppercase;}/* All uppercase*/

p.lowercase {text-transform :lowercase;}/* All lowercase*/

p.capitalize {text-transform:capitalize;}/* Capitalize the first letter*/


Text indent


The text-indent attribute is used to specify the indent of the first line of text.

Example: first line indent 50px


##p {text-indent:50px;}

Continuing Learning
||
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> <style> h1 { text-align: center; text-transform: uppercase; color: #A7C942; } p { text-indent: 50px; text-align:justify; letter-spacing:3px; } a { text-decoration:none; } </style> </head> <body> <h1>text formatting</h1> <p>This text is styled with some of the text formatting properties. The heading uses the text-align, text-transform, and color properties. The paragraph is indented, aligned, and the space between characters is specified. The underline is removed from the <a target="_blank" href="#">"尝试一下"</a> link.</p> </body> </html>
submitReset Code