.
--Complete HTML Tutorial
Introduction:-
What is HTML??
HTML is a language for describing web pages.
- HTML stands for Hyper Text Markup Language
- HTML is not a programming language, it is a markup language
- A markup language is a set of markup tags
- HTML uses markup tags to describe web pages
HTML Tags
HTML markup tags are usually called HTML tags.
- HTML tags are keywords surrounded by angle brackets like <html>
- HTML tags normally come in pairs like <b> and </b>
- The first tag in a pair is the start tag, the second tag is the end tag
- Start and end tags are also called opening tags and closing tags
HTML Documents = Web Pages
- HTML documents describe web pages
- HTML documents contain HTML tags and plain text
- HTML documents are also called web pages
The purpose of a web browser (like Internet Explorer or Firefox) is to read HTML documents and display them as web pages. The browser doesn't display the HTML tags, but uses the tags to interpret the content of the page.
Ex.
<html>
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</body>
</html>
The text between <html> and </html> describes the web page
The text between <body> and </body> is the visible page content
The text between <h1> and </h1> is displayed as a heading
The text between <p> and </p> is displayed as a paragraph
HTML can be written and edited using many different editors like Dreamweaver and Visual Studio. Using a plain text editor is the best way to learn HTML.
Basics:-
Save HTML file by using either the .htm or the .html file extension. There is no difference.
Headings
HTML headings are defined with the <h1> to <h6> tags.
Ex.
<h1>This is a heading</h1>
<h2>This is a heading</h2>.
.
<h6>This is a heading</h6>
Paragraphs
HTML paragraphs are defined with the <p> tag.
Ex.
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
Links
HTML links are defined with the <a> tag.
Ex.
<a href="http://www.webtechnoworld.com">This is a link</a>
Images
HTML images are defined with the <img> tag.
Ex.
<img src="image.jpg" width="104" height="142" />
HTML Elements
An HTML element is everything from the start tag to the end tag:
Ex.
<p> This is html Class.</p>
Here "This is html Class." is the element.
<p> is also called as opening tag & </p> as closing tag.
Syntax
- Element starts with a opening tag
- Element ends with an closing tag
- Some HTML elements have empty content
- Empty elements are closed in the start tag
- Most HTML elements can have attributes.
Element which contain another element called nested element.
Ex.
<html>
<body>
<p>This is my first paragraph.</p>
</body>
</html>Note: HTML tags are not case sensitive.
Attributes
- HTML elements can have attributes
- Attributes provide additional information about an element
- Attributes are always specified in the start tag
- Attributes come in name/value pairs like: name="value"
HTML links are defined with the <a> tag. The link address is specified in the href attribute:
Ex.
<a href="http://www.webtechnoworld.com">This is a link</a>
Attribute
Value
Description
class
classname
Specifies a classname for an element
id
id
Specifies a unique id for an element
style
style_definition
Specifies an inline style for an element
title
tooltip_text
Specifies extra information about an element (displayed as a tool tip)
Lines
The <hr /> tag creates a horizontal line in an HTML page.
The hr element can be used to separate content:
Ex.
<p>This is a paragraph</p>
<hr />
<p>This is a paragraph</p>
<hr />
Comments
Comments can be inserted into the HTML code to make it more readable and understandable. Comments are ignored by the browser and are not displayed.
Ex.
<!-- This is a comment -->
Tag Reference
Tag
Description
<html>
Defines an HTML document
<body>
Defines the document's body
<h1> to <h6>
Defines HTML headings
<hr />
Defines a horizontal line
<!-->
Defines a comment
Paragraphs
Paragraphs are defined with the <p> tag.
Ex.
<p>This is first paragraph</p>
<p>This is second paragraph</p>
Line Breaks
Use the <br /> tag if you want a line break (a new line) without starting a new paragraph:
Ex.
<p>This is<br />a para<br />graph with line breaks</p>
The <br /> element is an empty HTML element. It has no end tag.
Tag
Description
<p>
Defines a paragraph
<br />
Inserts a single line break
█████████████████████████████████████████████████
██████████████████ Basic Group Rules ███████████████████
Immoral & Rudish talk, Earning program links, Cell number for friendship purpose, Websites/Groups Links, Adult contents, Criticize-able Islamic stuff, Spreading disruption, Spamming are strictly prohibited and banned in group.
█████████████████████████████████████████████████
█████████████████████████████████████████████████
Follow these detailed Group Rules, otherwise you will be banned at any time.
https://docs.google.com/document/d/1YJxA8x3_U7C1lRc0EXfLrJpco4A1XkB1vDxOTqOd3Jg/edit?hl=en&authkey=CNDy9tkJ
Group Email Address:
Attock-VU-Group@Googlegroups.Com
Join group by sending a blank email from University ID at:
Attock-VU-Group+Subscribe@Googlegroups.Com
████████████ Click here to Join this group at Facebook:████████████
♥ ♥ ♥ https://www.facebook.com/home.php?sk=group_111877855568034 ♥ ♥ ♥
█████████████████████████████████████████████████
--
█████████████████████████████████████████████████
██████████████████ Basic Group Rules ███████████████████
Immoral & Rudish talk, Earning program links, Cell number for friendship purpose, Websites/Groups Links, Adult contents, Criticize-able Islamic stuff, Spreading disruption, Spamming are strictly prohibited and banned in group.
█████████████████████████████████████████████████
█████████████████████████████████████████████████
Follow these detailed Group Rules, otherwise you will be banned at any time.
https://docs.google.com/document/d/1YJxA8x3_U7C1lRc0EXfLrJpco4A1XkB1vDxOTqOd3Jg/edit?hl=en&authkey=CNDy9tkJ
Group Email Address:
Attock-VU-Group@Googlegroups.Com
Join group by sending a blank email from University ID at:
Attock-VU-Group+Subscribe@Googlegroups.Com
████████████ Click here to Join this group at Facebook:████████████
♥ ♥ ♥ https://www.facebook.com/home.php?sk=group_111877855568034 ♥ ♥ ♥
█████████████████████████████████████████████████
No comments:
Post a Comment