1. HTML Introduction
HTML stands for Hypertext Markup Language. It is a markup language used to structure content on the web. HTML markup involves using tags to wrap content and specify its formatting.
Example:
html
<!DOCTYPE html>
<html>
<head>
<title>My First HTML Document</title>
</head>
<body>
<h1>Welcome to my website</h1>
<p>This is a paragraph.</p>
</body>
</html>2. Basic Structure of HTML
Every HTML document follows the same basic structure:
html
<!DOCTYPE html>
<html>
<head>
<!-- Contains information about the web page like title, meta tags, stylesheets etc -->
</head>
<body>
<!-- Contains everything visible on the web page like text, images, links etc -->
</body>
</html>3. HTML Tags
HTML tags wrap content and specify its formatting. HTML tags can be used for text formatting, page structure, and inline graphics.
Example Text Formatting Tags:
html
<h1>Header 1</h1>
<h2>Header 2</h2>
<p>Paragraph</p>
<strong>Bold Text</strong>
<em>Italic Text</em>Example Page Structure Tags:
html
<header>Header</header>
<nav>Navigation Bar</nav>
<main>Main Content</main>
<aside>Secondary Content</aside>
<footer>Footer</footer>4. HTML Attributes
HTML attributes offer additional information about HTML elements. They are specified within the opening tag.
Example:
html
<img src="puppy.jpg" alt="A cute puppy">In this example, src and alt are attributes.
5. HTML Lists
HTML provides three types of list tags: <ul>, <ol>, and <dl>.
Example:
html
<ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ul>
<ol>
<li>First</li>
<li>Second</li>
<li>Third</li>
</ol>
<dl>
<dt>Term 1</dt>
<dd>Definition 1</dd>
<dt>Term 2</dt>
<dd>Definition 2</dd>
</dl>6. HTML Links
HTML links are used to link pages, resources, or sections within a web page.
Example:
html
<a href="https://www.google.com/">Click me to go to Google.com</a>7. HTML Images
Images are often used on web pages to add visual interest. In HTML, images are inserted using the <img> tag.
Example:
html
<img src="image.jpg" alt="A description of the image">Conclusion
This basic HTML tutorial covered some essential elements of HTML that will help you get started. As your knowledge of HTML increases, you will learn more about formatting, structure, and other attributes that will help you create more sophisticated web pages.