Zahir Hadi Athallah
Posted on June 25, 2023
Introduction to HTML
HTML (Hypertext Markup Language) is a markup language used to build web pages. In this article, we will introduce HTML to you and provide basic tutorials on how to use HTML tags to create the structure and basic content of web pages. Additionally, we will provide some simple examples to clarify these concepts.
What is HTML?
HTML is a markup language used to structure and display web pages. HTML web pages consist of elements organized using HTML tags. Each HTML tag provides instructions to the browser on how to display that element to the user.
Basic HTML Tutorials
- Basic Structure of an HTML Page
Every HTML page should start with the <html>
tag and end with the </html>
tag. The content of the web page is typically divided into two main sections: the <head>
and the <body>
. The <head>
section contains metadata about the web page, such as the page title, links to CSS or JavaScript files, etc. The <body>
section contains the content that will be displayed on the web page.
Example :
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<h1>Welcome to my web page!</h1>
<p>This is an example paragraph.</p>
</body>
</html>
- Creating Headings and Paragraphs
You can use HTML heading tags (<h1>
to <h6>
) to mark up headings on your web page. The <p>
tag is used to create paragraphs.
Example :
<h1>This is a web page title</h1>
<h2>This is a subheading</h2>
<p>This is the first paragraph.</p>
<p>This is the second paragraph.</p>
- Creating Lists
You can create lists using the <ul>
(unordered list) tag for unordered lists or the <ol>
(ordered list) tag for ordered lists. Each item in the list is placed between <li>
tags.
Example :
<ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ul>
<ol>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ol>
- Adding Images
You can display images on web pages using the <img>
tag. You need to provide the src attribute, which contains the URL or path to the image you want to display.
Example :
<img src="image.jpg" alt="Image Description">
- Creating Links
To create links to other web pages, use the <a>
tag. You need to provide the href attribute, which contains the URL or path to the target web page.
Example :
<a href="https://www.example.com">Visit Example Website</a>
- Formatting Text
HTML provides tags to format text, such as bold, italic, and underline. You can use the <b>
tag for bold, <i>
tag for italic, and <u>
tag for underline
Example :
<p>This is <b>bold</b> text.</p>
<p>This is <i>italic</i> text.</p>
<p>This is <u>underlined</u> text.</p>
Closing:
HTML is the foundation of web development, and understanding its basics is crucial for anyone interested in building websites. In this article, we introduced HTML and provided tutorials on essential HTML tags and attributes, Happy coding!
Posted on June 25, 2023
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.