Basic Syntax of HTML
Lets take a quick dive in to HTML and go through all the Syntax is carries .But then , first of all what is “syntax”?
What is Syntax?
In HTML and CSS etc., syntax is the order in which elements appear or are written, meaning the grammar and spelling of the language. Syntax are in place to ensure the languages are always written in a way that can be read or interpreted by a computer. In simple words “the Rules” of a programming language can be know as syntax .
Basic Structure of an HTML document
Basic Syntax of HTML
All HTML documents must start with a document type declaration,
: <!DOCTYPE html>. The HTML document itself begins with <html> and ends with </html>.
The visible part of the HTML document is between <body> and </body>.
Almost all the Tags used in HTML which are used to wrap text or other data types have ,
- An opening Tag
- A Closing Tag,
But there are exceptions which does not follow this rule.
Common Syntax seen in All HTML files
And each of these declarations Tags have their own set of rules or methods to follow when using. As an Example :
The
<!DOCTYPE>declaration represents the document type, and helps browsers to display web pages correctly. HTML documents start with a document type declaration:<!DOCTYPE html>.This document type is mentioned in on top of each HTML page. Also the !<doctype> declaration is NOT case sensitive . Which means capital or simple letters can be used to write “doctype”.
Similarly there are specific rules for each and every Tags mentioned below.
- The
<!DOCTYPE html>declaration defines that this document is an HTML5 document - The
<html>element is the root element of an HTML page - The
<head>element contains meta information about the HTML page - The
<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 heading - The
<p>element defines a paragraph
The void elements or singleton tags
Only few exceptional tags does not require a closing tag because of their self closing nature. These types of Tags are know as The void elements or singleton tags .
These elements are usually ones that either stand alone on the page or where the end of their contents is obvious from the context of the page itself.
- <img>
- <link>
- <br> etc.…
are some of the common examples for void elements.
For extra knowledge
What is HTML source
When referring to a website, the source or HTML source code is the HTML or other code used to generate a web page on a browser. Have you ever seen a Web page and wondered “Hey! How did they do that?”
How to View HTML Source?
Right-click in an HTML page and select “View Page Source” (in Chrome) or “View Source” (in Edge), or similar in other browsers. This will open a window containing the HTML source code of the page.
Inspect an HTML Element:
Right-click on an element (or a blank area), and choose “Inspect” or “Inspect Element” to see what elements are made up of (you will see both the HTML and the CSS). You can also edit the HTML or CSS on-the-fly in the Elements or Styles panel that opens.
This way can be used to see the syntax and codes used in all websites across the world wide web.
Let’s take a deep dive into CSS and JS in future writings till then , Happy Coding! :)
