Prashant Sharma's Blog

Most Useful HTML Tags

Prashant Sharma's photo
Prashant Sharma
·

3 min read

Most Useful HTML Tags

There is no doubt

HTML remains the foundation on which every webpage is build upon.

HTML tags defines that how our web browser will display the content. With the help of different tags, a web browser can distinguish between an HTML content and a simple content.

HTML tags contain three main parts:

  • Opening tag
  • Content
  • Closing tag.

But some HTML tags are unclosed tags called as self closed tags.

Browser always reads an HTML document from top to bottom and left to right format.

NOTE - HTML tags are always written in lowercase letter. (Ex: <p>Paragraph Tag</p>)

1. Heading Tags

It defines headings for an HTML document from level 1 to level 6.

<h1>Heading1</h1>
<h2>Heading2</h2>
<h3>Heading3</h3>
<h4>Heading4</h4>
<h5>Heading5</h5>
<h6>Heading6</h6>

h1 defines the most important heading and h6 defines the least important heading.

2. Paragraph Tag

It represents a paragraph in an HTML document.

<p>Writing my first blog</p>

3. Image Tag

The img element lets you insert images into your web pages To insert an image, you first upload the image to your web server, then use an img tag to reference the uploaded image filename Here's an example.

<img src="image.png" alt="image">

The link tag defines the relationship between the current document and an external resource. Mostly used to link the stylesheet.

<link rel="stylesheet" href="styles.css">

5. Anchor tag

The anchor tag defines a hyperlink, which is used to link from one page to another. The most important attribute of the anchor element is the href attribute, which indicates the link's destination.

<a href="https://www.ineuron.io" >click here</a>

6. List tag

List tag represent the items in list. List may can be ordered or unordered. In ordered list we get the items in order format like 1, 2, 3..... and in unordered list we get the list in bullet format. 

<ol>
  <li>HTML</li>
  <li>CSS</li>
  <li>JavaScript</li>
</ol>

<ul>
  <li>ES6</li>
  <li>React JS</li>
  <li>Next JS</li>
</ul>

7. Option Tag

HTML option tag is used to define options in a dropdown list within select element. A dropdown list must have at least one element.

<select>
  <option>Choose your expertise</option>
  <option value="react">React</option>
  <option value="angular">Angular</option>
  <option value="vue">Vue</option>
</select>

8. Form tag

It is used to define HTML form. On websites we saw many forms such as registration, signup, login etc all are made up of form tag.

<form>  
    First Name: <input type="text" name="firstname"/> <br/>  
    Last Name:  <input type="text" name="lastname"/> <br/>  
 </form>

9. Input Tag

The HTML input tag is used to represent a form input control in HTML document. This form input control facilitate user to input data and communicate with a website.

<form action="#">  
First name: <input type="text" name="FirstName"  placeholder="enter firstname"/><br>
<input type="submit" value="Submit">  
</form>

10. Iframe Tag

Iframe is used to display a nested webpage (a webpage within a webpage). Iframe embeds another document within the current HTML document

<iframe width="560" height="315" src="https://www.youtube.com/embed/7F2LkS3jpPA" title="YouTube" ; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

There are lot more tags in HTML which can be used as per content and design of your web page.

HTML#html-interview