Text Properties Continued - I Shot the Serif - HTML with Style | WebReference

# Text Properties Continued - I Shot the Serif - HTML with Style

## Text Properties Continued

### The `text-align` property

 Property: text-align Accepted values: left, right, center or justified Initial value: Depends on user agent Applies to: Block-level Elements Inherited: Yes

The ```text-align property applies to block-level elements and affects the alignment of the text. Text can be aligned with the left margin, the right margin, both (justified) or centered.```

```<P STYLE="text-align: left">Some text on the left.
Some text on the left. Some text on the left.
Some text on the left. Some text on the left.
Some text on the left. Some text on the left.
Some text on the left. Some text on the left.
Some text on the left. Some text on the left.
Some text on the left. Some text on the left.
Some text on the left. Some text on the left.</P>
<P STYLE="text-align: right">Some text on the right.
Some text on the right. Some text on the right.
Some text on the right. Some text on the right.
Some text on the right. Some text on the right.
Some text on the right. Some text on the right.
Some text on the right. Some text on the right.
Some text on the right. Some text on the right.
Some text on the right. Some text on the right.</P>
<P STYLE="text-align: center">Some text in the middle.
Some text in the middle. Some text in the middle.
Some text in the middle. Some text in the middle.
Some text in the middle. Some text in the middle.
Some text in the middle. Some text in the middle.
Some text in the middle. Some text in the middle.
Some text in the middle. Some text in the middle.</P>
<P STYLE="text-align: left">Some text all over.
Some text all over. Some text all over. Some text all over.
Some text all over. Some text all over. Some text all over.
Some text all over. Some text all over. Some text all over.
Some text all over. Some text all over. Some text all over.</P>
```

Some text on the left. Some text on the left. Some text on the left. Some text on the left. Some text on the left. Some text on the left. Some text on the left. Some text on the left. Some text on the left. Some text on the left. Some text on the left. Some text on the left. Some text on the left. Some text on the left. Some text on the left.

Some text on the right. Some text on the right. Some text on the right. Some text on the right. Some text on the right. Some text on the right. Some text on the right. Some text on the right. Some text on the right. Some text on the right. Some text on the right. Some text on the right. Some text on the right. Some text on the right. Some text on the right.

Some text in the middle. Some text in the middle. Some text in the middle. Some text in the middle. Some text in the middle. Some text in the middle. Some text in the middle. Some text in the middle. Some text in the middle. Some text in the middle. Some text in the middle. Some text in the middle. Some text in the middle.

Some text all over. Some text all over. Some text all over. Some text all over. Some text all over. Some text all over. Some text all over. Some text all over. Some text all over. Some text all over. Some text all over. Some text all over. Some text all over.

### The `text-indent` property

 Property: text-indent Accepted values: length Initial value: 0 Applies to: Block-level Elements Inherited: Yes

The `text-indent` property is used to indent the first line of a block element by a certain length.

```<P STYLE="text-indent: 1cm">This is an indented paragraph. This is an
indented paragraph. This is an indented paragraph. This is an indented
paragraph. This is an indented paragraph. This is an indented paragraph.
This is an indented paragraph. </P>
```

This is an indented paragraph. This is an indented paragraph. This is an indented paragraph. This is an indented paragraph. This is an indented paragraph. This is an indented paragraph. This is an indented paragraph.

### The `line-height` property

 Property: line-height Accepted values: normal, or a length, or a number Initial value: 0 Applies to: All Elements Inherited: Yes

The `line-height` property, which can be specified using the `font` shorthand property, specifies the height of a line of text, which can either be normal, or equal to a specific length, or certain times the size of the font.

```<P STYLE="line-height: 2">A Wide Paragraph. A Wide Paragraph. A Wide
Paragraph. A Wide Paragraph. A Wide Paragraph. A Wide Paragraph. A Wide
Paragraph. A Wide Paragraph. A Wide Paragraph.</P>
```

A Wide Paragraph. A Wide Paragraph. A Wide Paragraph. A Wide Paragraph. A Wide Paragraph. A Wide Paragraph. A Wide Paragraph. A Wide Paragraph. A Wide Paragraph.

That's all the properties I'm going to teach you today. Let's see if you can put them together.

Produced by Stephanos Piperoglou