Complete HTML 🤯

Introduction

Welcome 👋 to this blog. This blog contains all the required information of HTML. If you are completely new to the web development then you are in the right place and also if you are professional then also you can revise by reading this blog and also give me feedback in the comment section.
Let's get started 🚀

HTML

HTML stands for HyperText Markup Language. It gives the basic structure of the website or webpages. It define how your website look like in the sense of structure i.e., website contains heading, input, form, table, button and many more.

HTML Code

<!DOCTYPE html>
<html>
  <head>
    <title>Hello world</title>
  </head>
  <body> 
    <h1>Hello world</h1>
  </body>
</html>

You can check the live version of the Hello world website here whose code is written above.

We will talk about each line of the code in details so that you can get the idea of each line.

<!DOCTYPE html>

This line basically tells the web browser which HTML version we are using. In this case we are HTML5.

html

This is HTML element that contains all the code of our webpage. In other words, this contains all the structure and setup required i.e., external CSS, JS, CDN etc. of the webpage. You may notice that all the content comes between <html> and </html>. This is because so that all the content will be between these elements. <html> is generally refers to opening tags and </html> is generally refers to the closing tag.

head

This element contains all the requirements of the webpage. for example if you want to add some external CSS file, external JS file or some external CDN which is a requirement for the website then this element comes in handy. If you don't know about CSS it is used for the styling purpose, JS for the functionality purpose and CDN stands for Content Delivery Network.

title

This element contains the Title which is shown in the tab of the web browser. If you go to the Hello world website you will notice in the tab of the web browser, there is the title Hello world. This is the main work of these <title>...</title> tags.

body

This element contains the structure which is visible to the user. The above elements you can imagine can be used for the setup of our webpage. The main content goes into the body section.

h1

h1 is a heading element that is used for the heading. If you go to the hello world website there the hello world which is visible to us is the heading. h1 is not only the heading element we have. We have a heading element that starts from h1 and goes till h6 the only difference is that h1 is larger and then the size is decreased till h6.

If you want to read more about the elements of HTML you can check it here.

Lets create some table

<table>
  <tr>
    <th>S.No.</th>
    <th>Day</th>
  </tr>
  <tr>
    <td>1</td>
    <td>Sunday</td>
  </tr>
  <tr>
    <td>2</td>
    <td>Monday</td>
  </tr>
  <tr>
    <td>3</td>
    <td>Tuesday</td>
  </tr>
  <tr>
    <td>4</td>
    <td>Wednesday</td>
  </tr>
  <tr>
    <td>5</td>
    <td>Thursday</td>
  </tr>
  <tr>
    <td>6</td>
    <td>Friday</td>
  </tr>
  <tr>
    <td>7</td>
    <td>Saturday</td>
  </tr>
</table>

table : This is the table element which is used to create the table.
tr : It means table row. i.e., the row of the table.
td : It means table data. i.e., the data which contains the table.

You can check the live version of the code here.
Note This code must be written between the body element.

Time to create HTML form

You might have seen some HTML form when you surf the internet. Let's time to create our own HTML form.

Here is the code snippet.

    <form>
        Name: <input type="text" name="name"><br>
        Email: <input type="email" name="email"><br>
        <input type="submit" value="Submit">
    </form>

form : The HTML element help us to create the HTML form.
input : The input element allow us to take the input from the user. The type="email" and name="email" is called HTML attribute.

You can check the live version of the webpage here.
Note This code must be written between the body element.

Conclusion

In conclusion, HTML serves as the foundation of a website or webpage by defining its structure. It determines how the website appears in terms of elements such as headings, forms, tables, buttons, and more. By using HTML tags and elements, we can create a well-structured and organized webpage.

Contact me: ankursingh91002@gmail.com
LinkedIn
Twitter