The ABCs of HTML: Navigating Page Structure for Beginners
HTML, which stands for Hyper Text Markup Language, is the standard language used to create and design web pages. It provides the structure for web content by using a system of markup tags and attributes. Here's a brief overview:
A Simple HTML Document
Example
<!DOCTYPE html>
<html>
<head>
<title>First HTML Code</title>
</head>
<body>
<h2>Welcome To My Blog</h2>
<p>Hello Hashnoder</p>
</body>
</html>
Example Explained
The
<!DOCTYPE html>
declaration defines that this document is an HTML5 documentThe
<html>
element is the root element of an HTML pageThe
<head>
element contains meta information about the HTML pageThe
<title>
element specifies a title for the HTML page (which is shown in the browser's title bar or in the page's tab)The
<body>
element defines the document's body, and is a container for all the visible contents, such as headings, paragraphs, images, hyperlinks, tables, lists, etc.The
<h1>
element defines a large headingThe
<p>
element defines a paragraph
Comments in HTML
This is part of code that should not be parsed.
<!-- This is an HTML Comment -->
HTML is NOT case sensitive
<html> =<HTML>
<P> = <P>
<head> = <HEAD>
<body> = <BODY>
Basic HTML Tag
HTM Attributes: Attributes are used to add more information to the tag
<html lang="en"\>
Heading Tag
Used to display headings in HTML
h1,h2,h3,h4,h5,h6
Paragraph Tag
Used to add paragraphs in HTML
<p>This is a sample paragraph</p>
Anchore Tag
Used to add links to your page
Image Tag
Used to add images to your page
<img src="/image.png"alt=Random Image">
Bold, Italic & Underline Tags
Used to highlight text in your page
<b>Bold</b>
<i>Italic</i>
<u>Underline</u>
Big & Small Tags
Used to display big & small text on your page
<big>Big</big>
<small>Small</small>
Hr Tag
Used to display a horizontal ruler, used to separate content
<hr>
Subscript & Superscript Tag
<sub>subscript</sub>
H₂O
<sup>superscript</sup>
a2 + b2
Pre Tag
Used to display text as it is (without ignoring spaces & next line)
<pre> This
is a sample
text.
</pre>