CSS tutorial: List of styles in sequence

The font size of the serial number displayed in most browsers is the same as that of the text by default. This is a simple CSS tutorial that uses ordered lists and paragraph tags to design a trendy numbered list.

　　Summary

Define the <ol> font as Georgia font and set the <p> font to Arial.

　　1. Html source code

Write an ordered list and do not forget to wrap the text with <p>

Copy to ClipboardReference: [www.bkjia.com] <ol>
<Li>
<P> This is line one </p>
</Li>
<Li>
<P> Here is line two </p>
</Li>
<Li>
<P> And last line </p>
</Li>
</Ol>

This is displayed by default.

　　2. ol Element

Style ol Elements

Copy to ClipboardReference: [www.bkjia.com] ol {
Font: italic 1em Georgia, Times, serif;
Color: #999999;
}

The list becomes like this

　　3. ol p elements

Style ol p elements

Copy to ClipboardReference: [www.bkjia.com] ol p {
Font: normal. 8em Arial, Helvetica, sans-serif;
Color: #000000;
}

So it turned into the final form.

The original English text is translated at http://www.cnblogs.com/island205.