HTML: Subscript formatting

This entry is part 6 of 34 in the series HTML

Subscript makes text smaller and moves it below the baseline.

The most common use for subscript is in chemical formulas such as H2SO4.

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>Subscript Formatting</title>
</head>
<body>

<H2>H<sub>2</sub>O is actually water</H2>

</body>
</html>

HTML: Block quotation

This entry is part 7 of 34 in the series HTML

Block Quotation When quoting blocks from other sources, it is customary to indent those blocks from the main body of the text.

The <blockquote> does exactly that.

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>Quotation</title>
</head>
<body>

<h4>Steve Jobs:</h4>
<blockquote><p>You are already naked</p></blockquote>

</body>
</html>

HTML: Numbered and bulleted lists

This entry is part 8 of 34 in the series HTML

Lists The tag for a numbered list is <ol>, which stands for ordered list.

For a bulleted list, the tag is <ul>.

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>Lists</title>
</head>
<body>

<h4>British Pop</h4>
<ol>
    <li>Cold Play</li>
    <li>Depeche Mode</li>
    <li>Adele</li>
</ol>

<h4>American Rock</h4>
<ul>
    <li>Linkin Park</li>
    <li>Nirvana</li>
    <li>Metalica</li>
</ul>

</body>
</html>

HTML: Nested lists

This entry is part 9 of 34 in the series HTML

Nested Lists You can nest lists within one another.

In this example, we have a bulleted list embedded within a numbered list.

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>Nested Lists</title>
</head>
<body>

<ol>
    <li>Country</li>
    <li>British Pop:
        <ul>
            <li>Cold PLay</li>
            <li>Depeched Mode</li>
            <li>Adele</li>
        </ul>
    </li>
    <li>American Rock</li>
</ol>

</body>
</html>



The bulleted sublist, the <ul> tag, is placed within one of the <li> tags within the numbered <ol> list.

HTML: Changing the bullet or number character

This entry is part 10 of 34 in the series HTML

Bulleted Lists Bulleted lists and numbered lists can be styled by using a list-style-type attribute.

To apply the attribute, place it among the opening <ul> or <ol> tag.

For example, to use square bullets, use list-style-type: square.

<!DOCTYPE html>
<html>
<head lang='en'>
    <meta charset='UTF-8'>
    <title>Lists</title>
</head>
<body>

<h4>American Rock</h4>
<ul style='list-style-type: square'>
    <li>Linkin Park</li>
    <li>Nirvana</li>
    <li>Metalica</li>
</ul>

<h4>British Pop</h4>
<ol style='list-style-type: upper-roman'>
    <li>Cold Play</li>
    <li>Depeche Mode</li>
    <li>Adele</li>
</ol>

</body>
</html>