HTML stands for Hypertext Markup Language, and it is the most widely used language to write Web Pages.
- Hypertext refers to the way in which Web pages (HTML documents) are linked together. Thus, the link available on a webpage is called Hypertext.
- As its name suggests, HTML is a Markup Language which means you use HTML to simply “mark-up” a text document with tags that tell a Web browser how to structure it to display.
Mark up Tags:
A markup tags is the fundamental characteristics of HTML. Every markup tag is a command placed between “angle brackets” – left bracket (<) and a right bracket (>). Markup tags are not revealed by a web browser; they are invisible.
In most cases, markup tags (containing commands) come in pairs, with text or a graphic image
located between the beginning and ending tags.
For eg.: <command>text or a graphic image</command>.
HTML Tags:
As told earlier, HTML is a markup language and makes use of various tags to format the content. These tags are enclosed within angle braces <Tag Name>. Except few tags, most of the tags have their corresponding closing tags. For example, <html> has its closing tag </html> and <body> tag has its closing tag </body> tag etc.
1. <HTML> Tag – This tag encloses the complete HTML document and mainly comprises of document header which is represented by <head>...</head> and document body which is represented by <body>...</body> tags.
An HTML document begins with <HTML> tag and ends with </HTML> tag.
2. <Head> Tag – this tag contains information about the document including its title, scripts used, style definitions, and document description. You can use different sizes for your headings. HTML also has six levels of headings, which use the elements <h1>, <h2>, <h3>, <h4>, <h5>, and <h6>. While displaying any heading, browser adds one line before and one line after that heading.
The Head Tag is entered between <HTML> tags.
3. <Title> Tag – this tag contains the document title. The title specified inside <title> tag appears on the browser’s title bar.
It is entered between opening and closing <Head> tags.
4. <Body> Tag – this tag encloses all the tags, attributes and information to be displayed in the webpage.
It is entered below the closing </Head> tag and above closing </HTML> tag.
5. Container Tags – in HTML, tags that include both ON and OFF tag are called container elements. These tags wrap around text in our document and the Title, Body and HTML tags are the examples.
6. Paragraph Tag - The <p> tag offers a way to structure your text into different paragraphs. Each paragraph of text should go in between an opening <p> and a closing </p> tag.
7. Line Break Tag - Whenever you use the <br /> element, anything following it starts from the next line. This tag is an example of an empty element, where you do not need opening and closing tags, as there is nothing to go in between them.
The <br /> tag has a space between the characters br and the forward slash. If you omit this space, older browsers will have trouble rendering the line break, while if you miss the forward slash character and just use <br> it is not valid in HTML.
8. Comment Line – In HTML, comment line is declared as <! Any Text>
9. Document Tag – the first HTML tag on every .html file is the document tag.
10. Empty Tag – these tags require a starting but no closing tag. The just carry out the job assigned to them.
11. Pre Tag – these tags are used to create extra lines in a document without typing any text between them. For each additional blank line, we want to add, we have to just press enter after the first tag one time.
12. Ordered List <OL> Tag – used to indicate a list item as contained in an ordered or numbered from.
13. Bulleted/Unordered List <UL> Tag – it is used to indicate a list item as contained in an unordered or bulleted form.
14. Anchor <A> Tag – the anchor tag marks the text as hyperlink.
HTML Document Structure:
A typical HTML document will have the following structure:
Document declaration tag
<html>
<head>
Document header related tags
</head>
<body>
Document body related tags
</body>
</html>
Basic Structure of an HTML Document:
In its simplest form, following is an example of an HTML document:
<!DOCTYPE html>
<html>
<head>
<title>This is document title</title>
</head>
<body>
<h1>This is a heading</h1>
<p>Document content goes here.....</p>
</body>
</html>
Note: HTML is not case sensitive. <HTML> and <html>, both are same.
Creating an HTML document:
Steps to create an HTML document include: -
- Open Text Editor.
- Type the HTML code in the Text editor.
- Save the code with .htm or .html extension.
- Go to file menu and click on “save As”.
- Choose the location. Select “All Files” from the Save as Type” drop-down menu.
- Open the saved.htm or.html file.
- It will automatically open in your default web browser.
- To edit again, click on “Open with” after right-click on the .htm or .html file icon and choose the text editor’s name.
Image Src:
Image source s used to insert images in a webpage in HTML.
Bgcolour:
It is an attribute in <body> tag used to define body colour of the webpage.
For example: <body bgcolour = “maroon”>
Text:
It is an attribute in <body> tag used to define text colour.
For Example: <bodytext = “yellow”>
