Create a company webpage by using 15 HTML tags

As you all know, for a webpage, HTML is as important as its bone of structure for a human being.

In this blog, we have mentioned 15 HTML tags that are most important for any webpage:-

(1.) Head Tag:-

This tag contains information about the page( rather than information that is shown within the main part of the browser window that is highlighted in blue on the opposite page).


(2.) Body Tag:-

You met <body> element in the first example we created. Everything inside this element is shown inside the main browser window.


(3.) Title Tag:-

The contents of the <title> element are either shown in the top of the browser, above where you usually type in the URL of the page you want to visit, or on the tab for that page (if your browser uses tabs to allow you to view multiple pages at the same time).


(4.) Heading Tag:-

HTML has six "levels" of headings:

<h1> is used for main headings 
<h2> is used for subheadings If there are further sections under the subheadings then the 
 <h3> element is used, and so on...
Browsers display the contents of headings at different sizes. The contents of an <h1> element is the largest, and the contents of an <h6> element is the smallest. The exact size at which each browser shows the headings can vary slightly. Users can also adjust the size of text in their browser.


(5.) Paragraph Tag:-

To create a paragraph, surround the words that make up the paragraph with an opening <p> tag and closing </p> tag.


(6.) Division Tag:-

The <div> tag defines a division or a section in an HTML document. The <div> tag is used as a container for HTML elements - which is then styled with CSS or manipulated with JavaScript. The <div> tag is easily styled by using the class or id attribute.


(7.) Break Tag:-

As you have already know, the browser will automatically show each new paragraph or heading on a new line. But if you wanted to add a line break inside the middle of a paragraph you can use the line break tag <br />.


(8.) Anchor Tag:-

Links are created using the <a> element which has an attribute called href. The value of the href attribute is the page that you want people to go to when they click on the link.

Users can click on anything that appears between the opening <a> tag and the closing </a> tag and will be taken to the page specified in the href attribute.
When you link to a different website, the value of the href attribute will be the full web address for the site, which is known as an absolute URL.


(9.) Ordered Lists:-

<The ordered list is created with  the <ol> element.
<li> Each item in the list is placed between an opening <li> tag and a closing </li> tag. (The li stands for list item.) Browsers indent lists by default.


(10.) Unordered Lists:-

The unordered list is created with the <ul> element.
<li> Each item in the list is placed between an opening <li> tag and a closing </li> tag. (The li stands for list item.)
Browsers indent lists by default.


(11.) Strong Tag:-

The use of the <strong> element indicates that its content has strong importance. For example, the words contained in this element might be said with strong emphasis.

By default, browsers will show the contents of a <strong> element in bold.


(12.) Emphasis Tag:-

The <em> element indicates emphasis that subtly changes the meaning of a sentence.

By default browsers will show the contents of an <em> element in italic.


(13.) Image Tag:-

To add an image into the page you need to use an <img> element. This is an empty element (which means there is no closing tag). It must carry the following two attributes:

Src

This tells the browser where it can find the image file. This will usually be a relative URL pointing to an image on your own site.

Alt

This provides a text description of the image which describes the image if you cannot see it.

Title

 You can also use the title attribute with the <img> element to provide additional information about the image. Most browsers will display the content of this attribute in a tootip when the user hovers over the image.


(14.) Table Tag:-

The <table> element is used  to create a table. The contents  of the table are written out row  by row.


<tr> 

 You indicate the start of each  row using the opening <tr> tag.  (The tr stands for table row.)  It is followed by one or more  <td> elements (one for each cell  in that row).  At the end of the row you use a   closing </tr> tag.


<td> 

Each cell of a table is  represented using a <td>  element. (The td stands for  table data.) At the end of each cell you use a  closing </td> tag.


<th>

The <th> element is used just like the <td> element but its purpose is to represent the heading for either a column or a row. (The th stands for table heading.)


<thead>

The headings of the table should sit inside the <thead> element.


<tbody>

The body should sit inside the <tbody> element.


<tfoot>

The footer belongs inside the <tfoot> element.



(15.) Form Tag:-


Form controls live inside a <form> element. This element should always carry the action attribute and will usually have a method and id attribute too.


Special part :-

At the top of a long page  you might want to add a list  of contents that links to the  corresponding sections lower  down. Or you might want to add  a link from part way down the  page back to the top of it to save  users from having to scroll back  to the top.

Before you can link to a specific  part of a page, you need to  identify the points in the page  that the link will go to. You do  this using the id attribute (which  can be used on every HTML  element). You can see that the  <h1> and <h2> elements in this  example have been given id  attributes that identify those  sections of the page.
The value of the id attribute  should start with a letter or an  underscore (not a number or  any other character) and, on a  single page, no two id attributes  should have the same value.

To link to an element that uses  an id attribute you use the <a>  element again, but the value of  the href attribute starts with  the # symbol, followed by the  value of the id attribute of the  element you want to link to. In  this example, <a href="#top">  links to the <h1> element at  the top of the page whose id  attribute has a value of top.


Thanking you for read my blog 😁😁

5 comments