HTML
What is HTML?
HTML is the standard markup language for creating Web pages.
HTML stands for Hyper Text Markup Language
HTML describes the structure of Web pages using markup
HTML elements are represented by tags.
Who developed HTML?
HTML was developed by W3C and WHATWG in 1993.
It's latest release was version 5.1. Extended from SGML to XHTML.
What is the file name extension of HTML?
File name extension is. html and .htm
How and where to write HTML code?
Html is used to create webpage.
To write html follow these simple steps.
Step 1: Open Notepad (PC)
Windows 8 or later:
Open the Start Screen (the window symbol at the bottom left on your screen). Type Notepad.
Windows 7 or earlier:
Open Start > Programs > Accessories > Notepad
Step 2: Write Some HTML
<!DOCTYPE html>
<html>
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</body>
</html>
Step 3: Save the HTML Page
Save the file on your computer. Select File > Save as in the Notepad menu.
Name the file "file name. htm" and set the encoding to UTF-8 (which is the preferred encoding for HTML files).
You can use either .htm or .html as file extension.
Step 4: View the HTML Page in Your Browser
Open the saved HTML file in your favorite browser (double click on the file, or right-click - and choose "Open with")
HTML Structure:
<!DOCTYPE html>
<html>
<head>
<title>Page title</title>
</head>
<body>
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
</body>
</html>
Note:Only the content inside the <body> section is displayed in a browser.
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>.
HTML Headings:
HTML headings are defined with the <h1> to <h6> tags.
<h1> defines the most important heading. <h6> defines the least important heading:
Example :
<h1>Welcome</h1>
In the output Welcome is displayed as an output which is given between the tags <h1> and </h1>.
HTML Horizontal Rules:
The <hr> tag defines a thematic break in an HTML page, and is most often displayed as a horizontal rule.
The <hr> element is used to separate content (or define a change) in an HTML page:
Example:
<h1>This is heading 1</h1>
<p>This is some text.</p>
<hr>
HTML Paragraphs:
HTML paragraphs are defined with the <p> tag:
Example :
<p>Hi friend </p>
HTML Line Breaks:
The HTML <br> element defines a line break.Use <br> if you want a line break (a new line) without starting a new paragraph:
Example
<p>This is<br>a paragraph<br>with line breaks.</p>
The <br> tag is an empty tag, which means that it has no end tag.
The HTML <pre> Element:
The HTML <pre> element defines preformatted text.
The text inside a <pre> element is displayed in a fixed-width font (usually Courier), and it preserves both spaces and line breaks:
Example
<pre>
Priya is my friend.
She lives in Chennai.
</pre>
The HTML Style Attribute
Setting the style of an HTML element, can be done with the style attribute.
The HTML style attribute has the following syntax:
<tagname style="property:value;">
The property is a CSS property. The value is a CSS value.
HTML Background Color
The background-color property defines the background color for an HTML element.
This example sets the background color for a page to blue:
Example
<body style="background-color:powderblue;">
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
</body>
HTML Text Color
The color property defines the text color for an HTML element:
Example
<h1 style="color:blue;">This is a heading</h1>
<p style="color:red;">This is a paragraph.</p>
HTML Fonts
The font-family property defines the font to be used for an HTML element:
Example
<h1 style="font-family:verdana;">Welcome</h1>
<p style="font-family:courier;">Hi friend .</p>
HTML Text Size
The font-size property defines the text size for an HTML element:
Example
<h1 style="font-size:300%;">Welcome</h1>
HTML Text Alignment
The text-align property defines the horizontal text alignment for an HTML element:
Example
<h1 style="text-align:center;">Centered Heading</h1>
<p style="text-align:center;">Centered paragraph.</p>
HTML Images Syntax
In HTML, images are defined with the <img> tag.
The <img> tag is empty, it contains attributes only, and does not have a closing tag.
The src attribute specifies the URL (web address) of the image:
<img src="url" alt="some_text" style="width:width;height:height;">
The alt Attribute
The alt attribute provides an alternate text for an image, if the user for some reason cannot view it (because of slow connection, an error in the src attribute, or if the user uses a screen reader).
If a browser cannot find an image, it will display the value of the alt attribute:
Example
<img src="rose. gif" alt=" Icon" style="width:128px;height:128px;">
Image Size - Width and Height
You can use the style attribute to specify the width and height of an image.
The values are specified in pixels (use px after the value):
Example
<img src="rose .gif" alt=" Icon" style="width:128px;height:128px;">
Always specify width and height to avoid flicker.
HTML Links - Hyperlinks
HTML links are hyperlinks.
Syntax:
In HTML, links are defined with the <a> tag:
<a href="url">link text</a>
Example
<a href="https://www.google.com/html/">
The href attribute specifies the destination address
The link text is the visible part .
Clicking on the link text will send you to the specified address.
HTML Link Colors
By default, a link will appear like this
An unvisited link is underlined and blue
A visited link is underlined and purple
An active link is underlined and red
Example:
<style>
a:link {color:green; background-color:transparent; text-decoration:none}
a:visited {color:pink; background-color:transparent; text-decoration:none}
a:hover {color:red; background-color:transparent; text-decoration:underline}
a:active {color:yellow; background-color:transparent; text-decoration:underline}
</style>
Recommended topics :
Website 