Monday, 24 December 2012

Headings


HTML Headings

HTML Headings are just the same as you have expected - 'Heading' or 'Title' of the webpage.
Headings are defined with <h1> to <h6> tags, 'h1' being the most important and prominent. The size of the text between these tags reduces with 'h2', 'h3' and so on. By default, headings are displayed in bold text.
Now let's write some HTML codes to test the headings in browser. Open notepad or any other text-editor and type the following html codes. Alternatively as usual, you can use HTML Code Tester.

HTML Headings Example

<html>
<head>
    <title>HTML Headings</title>
</head>
<body>
    <h1>
        This is 'h1' heading</h1>
    <h2>
        This is 'h2' heading</h2>
    <h3>
        This is 'h3' heading</h3>
    <h4>
        This is 'h4' heading</h4>
    <h5>
        This is 'h5' heading</h5>
    <h6>
        This is 'h6' heading</h6>
</body>
</html>

Save this webpage as 'headings.html' in html folder. Open this file in your web browser to see the difference between various html headings. Did you notice the gap between the html headings? This is because browsers add some empty space just before and after headings to make these more prominent.

No comments:

Post a Comment