HTML and HTML5 tutorial for beginners

Don't try to memorize anything. Try to do it yourself where I will show you how to do it. Learning HTML is impossible without practice.

What is HTML?

HTML is a web language used to create web pages. The text you are reading now is made with HTML. HTML is also needed to create the Facebook you use. The equivalent of HTML: Hypertext Markup Language. No need to memorize what the HTML equivalent is. To understand HTML, imagine what a newspaper looks like.

The picture above is a newspaper picture. Note that the contents of the newspaper are arranged according to a rule. The headers are slightly larger and bolted. Detailed news written in short. The entire newspaper is divided into 2 columns. The right-side column is again divided into two more columns and these 2 columns have text on the left and image on the right. This way you can extract many parts of the entire newspaper. Now, if you want to display this newspaper on the web, you need to take the help of HTML. The elements of HTML used to create each part of a newspaper are called tags. The tag looks like below:

Here start means but not actually start. Suppose you write a sentence: I am bold, and you want this text to appear in bold as follows: I am bold

To do this, HTML has a tag called b, here the tag is created with the first letter of the word bold. That is, start will be replaced by b and the tag should be seen: . Now I am bold This text will become bold if you write it between and . That is, the text with tags should look like below:

I am bold

In this part you learned: What is HTML? What is HTML tag or short tag? It is said that knowing HTML tags is enough to learn HTML. really so You've seen how text can be bolded using the tag. Now you just need to know the remaining tags. Usage is exactly like the tag. Many go to memorize all the tags. This is very wrong. I will demonstrate the use of tags with examples throughout my course. Before that, in the next part we will see how HTML works, i.e., why any text between is bolded.

It is better to say, I have given the example of newspaper to understand HTML, it does not mean that only newspaper-like structure can be created with HTML. Any type of structure can be created with HTML.

How HTML Works

We have seen how to change a text by writing html tags. Now we will know how this works i.e. how HTML works.

There is a thing called HTML Parser to process the HTML code we write. Where is this HTML Parser? It's in every browser. We have filmed a bit to make the whole thing easier to understand. All the web sites we see we see with some browser or app. HTML Parser comes with that browser and app. The HTML Parser parses the HTML code before it's visible to your eyes. For example: I am bold To understand how this HTML code catches your eye as I am bold, we have filmed it as follows: HTML tags

HTML is a collection of tags. An HTML document is made up of many tags. That's why HTML is sometimes called tag language. In the basic discussion of HTML, an idea about HTML tag has been given. Now HTML tags will be discussed in sequence.

Types of HTML tags

There are 2 types of HTML tags.

  1. paired tag
  2. unpaired tag

Paired tag: Those tags which have two parts are called paired tag. For example: tag is a paired tag. Because it has two parts, the first part is: and the last part is:
Unpaired tag: Those tags which have only one part are called unpaired tag. For example: tag is an unpaired tag. The tag has nothing to say. A tag consisting of only one part is called unpaired tag or unpaired tag.

HTML Attribute

HTML tags contain attributes. attribute is used to add different properties to an HTML element. Two parts of attribute:

  1. attribute name
  2. attribute value

It is written as follows:

attribute 

name = “attribute value”

For example, there is an attribute called id and the value of this attribute can be anything. For ease of understanding, take the value of attribute: abc. Then the attribute will look like below:

id = “abc”

The attribute is written inside the tag. In the case of paired tag, the attribute is written inside the tag of the first part. For example, if you want to add the id =”bold” attribute to I am bold, do the following:

I am bold

If you want to add the id=”profile_pic” attribute to the do the following:

Creating web page structure with HTML

Let's use what we've learned so far to create a basic structure of what a web page looks like today. Remember what a tag looks like? . The HTML tag here should be used to replace start. Consider, a tag in HTML is named: Mango. The tag will then be . There is no tag called Mango, just a fun attempt to get your head around what a tag looks like. Note one more thing, each tag has 2 parts. For example: is the first part, it is called the opening tag. Again is the second part. It is a closing tag. The primary structure of a web page consists of 3 tags. There are three tags: tag, tag and tag. The head tag and body tag are placed inside the html tag. One more line should be written at the very beginning with these three tags. The line is:. That is, the structure of an HTML web page looks like this:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Page Title</title>
  </head>
  <body>
    <h1>Heading</h1>
    <p>Paragraph</p>
  </body>
</html>

Here line implies: DOCUMENT TYPE of whatever is going to be written here is: html.