Get to Know the Elements with Attributes

This is the second blog in the series 'Learn HTML'.

Introduction 
 
Today we will be learning about the elements.
 
Opening tags say, “This is the beginning of a tag,” whereas the closing tag notifies the end of a tag. The text enclosed within the angle brackets describes the purpose of the tag. For instance, <p> represents the purpose of the tag, showing that the tag is about a paragraph. To understand the level as a concept, another example is  <h1>, a tag that shows it is about heading and the level of the heading, 1.
  • <html>, this is the opening tag for HTML
  • </html>, this is the closing tag for HTML
  • <head>, this is the opening tag for head
  • </head>, this is the closing tag for head
  • <title>, this tag is the opening tag for title
  • </title>, this tag is the closing tag for title
  • <body>, this tag is the opening tag for body
  • </body>, this tag is the closing tag for body
  • <p>, this is the opening tag for paragraph</p>, this is the closing tag for paragraph
  • <h1>, this is the opening tag for heading 1
  • </h1>, this is the closing tag for heading 1
  • <h2></h2>, <h3></h3>, <h4>,</h4></h4>,<h5></h5>,<h6></h6>
The head element <head> often referred or called as the head of the page, contains information about the page. This head element contains a title for the webpage.
 
The body element is often said to be the tag that opens the tag for the body. This tag encloses all the information that we see in the main browser window. It contains the opening and closing of the tag with all the data enclosed between it.

So it is right to say that together <html><head> and <body> make the skeleton for the HTML document. They are the foundation that every web page that is built upon.
 
You can see a title element inside the head element of the first web page.
  1. <head>  
  2.    <title> My First Webpage </title>   
  3. </head>  
The real content of your page is held in the <body> element, which is what you want users to read. This is displayed in the main browser window.
 
Let’s see the concepts in detail with a hands-on lab:
  1. <html>  
  2.    <head>  
  3.       <title>Getting to know the elements with attributes</title>  
  4.    </head>   
  5.    <body>  
  6.       <h1> About HTML as a language </h1>  
  7.       <p> The language is a quite strange, from this language the elements are to be understood. The idea was the modest one, from the web server. He created a quick look with hypertext markup language that would serve as a purpose. </p>  
  8. <p><a href =https://nasirmeeran.com> visit the author website></a> </p>  
  9.    </body>  
  10. </html>  
In this lab, we saw a new tag <a>. This element <a> creates a link between the tag <a>, and </a>, the text that you can click onto it. Let's talk about the opening tag, <a>, more closely. <a href =” #”> carries something called an attribute. In the above case, href is the attribute. "href" is followed by an “equal-to” sign =, proceeded with a double quotation. Moreover, if you want to open the link in a new window, add the attribute “target” to the opening tag of <a>.
  1. <a href =https://nasirmeeran.com> visit the author website target = “_blank>” </a>  
Just an informational tip, attributes are made up of two parts, the name of the attribute and the value of attribute, separated by the equal-to sign. Values are to be put in double quotation marks.
 
Here is a link, which will further explain the concept.