Headings
Headings are essential for organizing and structuring content on a web page. HTML provides six levels of headings, from <h1> for the main heading to <h6> for the least important heading.
Here's an example:
<!DOCTYPE html>
<html>
<head>
<title>Heading Example</title>
</head>
<body>
<h1>Main Heading</h1>
<h2>Subheading</h2>
<h3>Sub-subheading</h3>
<h4>Another level</h4>
<h5>Heading</h5>
<h6>Smallest Heading</h6>
</body>
</html>
<html>
<head>
<title>Heading Example</title>
</head>
<body>
<h1>Main Heading</h1>
<h2>Subheading</h2>
<h3>Sub-subheading</h3>
<h4>Another level</h4>
<h5>Heading</h5>
<h6>Smallest Heading</h6>
</body>
</html>
Paragraphs
Paragraphs are used to display blocks of text. They are defined using the (<p>) element. Here's an example:
<!DOCTYPE html>
<html>
<head>
<title>Paragraph Example</title>
</head>
<body>
<p>This is a paragraph. It contains text that forms a block.</p>
<p>Another paragraph here. You can have multiple paragraphs in HTML.</p>
</body>
</html>
<html>
<head>
<title>Paragraph Example</title>
</head>
<body>
<p>This is a paragraph. It contains text that forms a block.</p>
<p>Another paragraph here. You can have multiple paragraphs in HTML.</p>
</body>
</html>
Lists
HTML supports ordered lists (<ol>), unordered lists (<ul>), and definition lists (<dl>). Here are examples of each:
Ordered List:
<!DOCTYPE html>
<html>
<head>
<title>Ordered List Example</title>
</head>
<body>
<ol>
<li>First item</li>
<li>Second item</li>
<li>Third item</li>
</ol>
</body>
</html>
<html>
<head>
<title>Ordered List Example</title>
</head>
<body>
<ol>
<li>First item</li>
<li>Second item</li>
<li>Third item</li>
</ol>
</body>
</html>
Unordered List:
<!DOCTYPE html>
<html>
<head>
<title>Unordered List Example</title>
</head>
<body>
<ul>
<li>Apple</li>
<li>Orange</li>
<li>Banana</li>
</ul>
</body>
</html>
<html>
<head>
<title>Unordered List Example</title>
</head>
<body>
<ul>
<li>Apple</li>
<li>Orange</li>
<li>Banana</li>
</ul>
</body>
</html>
Definition List:
<!DOCTYPE html>
<html>
<head>
<title>Definition List Example</title>
</head>
<body>
<dl>
<dt>HTML</dt>
<dd>HyperText Markup Language</dd>
<dt>CSS</dt>
<dd>Cascading Style Sheets</dd>
</dl>
</body>
</html>
<html>
<head>
<title>Definition List Example</title>
</head>
<body>
<dl>
<dt>HTML</dt>
<dd>HyperText Markup Language</dd>
<dt>CSS</dt>
<dd>Cascading Style Sheets</dd>
</dl>
</body>
</html>
Links
Links (<a> elements) are used to navigate between web pages or resources. You can set the href attribute to specify the destination URL. Here's an example:
<!DOCTYPE html>
<html>
<head>
<title>Link Example</title>
</head>
<body>
<a href="https://www.example.com">Visit Example.com</a>
</body>
</html>
<html>
<head>
<title>Link Example</title>
</head>
<body>
<a href="https://www.example.com">Visit Example.com</a>
</body>
</html>
Practice Excercise Practice now