☰
In this tutorial, we will learn about HTML Formatting.
HTML uses tags to define and format the content on a web page.
These tags are enclosed in angle brackets and come in pairs – an opening tag and a closing tag.
The opening tag defines the beginning of an element, while the closing tag marks the end of that element.
Here's a simple example:
<p>This is a paragraph of text.</p>
In this case, <p> is the opening tag, and </p> is the closing tag. Everything between these tags is part of the "paragraph" element.
HTML provides various tags for basic text formatting. Some of the most common ones include:
<strong> and <em>: These tags are used for text that should be displayed as strong and emphasized, respectively. By default, web browsers often display <strong> text as bold and <em> text as italic.
<p>Use <strong>strong</strong> for important text and <em>emphasize</em> for added impact.</p>
<u>: The <u> tag underlines the text it encloses.
<p>This text is <u>underlined</u>.</p>
<s>: The <s> tag strikes through the enclosed text, indicating that it's no longer relevant or has been deleted.
<p>This is <s>old information</s>.</p>
<sub> and <sup>: These tags are used for subscript and superscript text, respectively.
<p>Water is composed of H<sub>2</sub>O, and Einstein's famous equation is E=mc<sup>2</sup>.</p>
HTML provides heading tags from <h1> to <h6> to define headings of different levels, with <h1> being the highest level and <h6> the lowest.
<h1>This is a level 1 heading</h1>
<h2>This is a level 2 heading</h2>
These tags help structure the content of a webpage and also influence search engine optimization (SEO) since search engines use headings to understand the hierarchy of information on a page.
HTML allows you to create both ordered and unordered lists using the <ul> and <ol> tags, respectively. List items are denoted with the <li> tag.
Unordered List:
<ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ul>
Ordered List:
<ol> <li>First item</li>
<li>Second item</li>
<li>Third item</li>
</ol>
Hyperlinks are a fundamental feature of the web. You can create them using the <a> tag. The href attribute specifies the URL to which the link points.
<a href="https://www.example.com">Visit Example.com</a>
To create anchors, you can use the <a> tag with the name attribute. This allows you to link to a specific part of the page.
<a name="section1">Section 1</a>
To display images on a web page, the <img> tag is used. The src attribute specifies the image source, and the alt attribute provides a text description of the image for accessibility and SEO.
<img src="image.jpg" alt="A beautiful landscape">
The <div> and <span> elements are used for grouping and applying styles to content.
<div> is a block-level element, typically used to create sections of a web page,
while <span> is an inline element, often used for styling specific portions of text.
HTML formatting is the backbone of web development. Understanding how to use HTML tags to structure and format content is essential for creating web pages that are not only visually appealing but also accessible and well-organized. As you continue your journey into web development, mastering HTML formatting is a fundamental skill that will serve you well in creating and maintaining websites.
© 2022-2023 All rights reserved.