Basics of HTML | Web Development

HTML Basics
HTML is a language which is used for creating web pages. A web page may contain a set of images, videos, paragraphs, data tables and more. Lets understand the basics of HTML with this simple HTML document.
<!DOCTYPE html> <html lang = "en"> <head> <meta charset = "UTF-8"> <meta name = "viewport" content = "width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA- Compatible" content = "ie=edge"> <title> your title here </title> <link rel ="stylesheet" href="style.css"> </head> <body> <script src = "index.js"> </script> <h1> This is heading1 </h1> <h2> This is heading2 </h2> <p> This is a paragraph </p> </body> </html>
So, this the simple HTML document also known as boilerplate, we have already discussed about it in our previous post you can check it from here, And the very important point that I wanna share with you is that the visible part of the HTML document that everyone can see is placed between <body> tags. So, now lets understand some basics like HTML Headings, Paragraphs, Links and more.
HTML Headings
HTML includes six levels of headings, which are defined with <h1> and <h6> tags. Here <h1> defines the most important heading and <h6> defines the least important heading.
Example
<h1> This is heading1 </h1> <h2> This is heading2 </h2> <h6> This is heading6 </h6>
Output
This is heading1
This is heading2
This is heading6
As you can see here, heading1 is greater in size then other headings, and we usually use it to highlight an important text. heading2 is smaller in size then heading1 and heading6 is very small. You can try it yourself by using ant text editor or simply using notepad.
Comments in HTML
Comments help to add extra information about the code. Browser does not display comments, Here is how you can add comments in HTML
<h1> This is heading1 </h1> <h2> This is heading2 </h2> <!-- This is a comment --> <h6> This is heading6 </h6>
Output
This is heading1
This is heading2
This is heading6
As you can see here, browser does not display the comment.
HTML Paragraphs
Paragraphs in HTML are defined with <p> tag.
Example
<p> This is Paragraph </p> <p> This is also a Paragraph </p>
Output
This is Paragraph | |
This is also a Paragraph |
HTML Links
We use <a> tag to define the HTML links.
Example
<a href = "https://crus4.com"> This is a link </a>
Output
href attribute are used to declare the link’s destination. We will learn more about attributes in the upcoming posts.
How to view source code of any web page
You can view source code of every web page you like, Simply Right-click in a HTML page and select “view page source”. This will open a window which contain the HTML source code of the page.
You can also Right-click on any web page and choose “inspect”. This will open a window which contain source code of both the HTML and CSS.
Related Posts
History of HTML | Boilerplate Explained
How to download and install VS code on you laptop
Text Formatting and Attributes in HTML
6 thoughts on “Basics of HTML | Web Development – crus4”