HTML
HTML
INTRODUCTION
HTML stands for Hyper Text Markup
Language
predominant markup language for web pages
Developed by World Wide Web Consortium
& WHATWG
Type of format Markup language
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 tags are not case sensitive
HTML Headings
HTML headings are defined with the <h1> to <h6> tags.
HTML Paragraphs
HTML paragraphs are defined with the <p> tag.
HTML Links
HTML links are defined with the <a> tag.
HTML Images
HTML images are defined with the <img> tag.
HTML Comments
Comments can be inserted in the HTML code to make it
more readable and understandable but they are
ignored by the browser and are not displayed.
HTML Element
An HTML element starts with a start tag / opening
tag and ends with an end tag / closing tag
The element content is everything between the start
and the end tag
Some HTML elements have empty content . Eg.line
break
Empty elements are closed in the start tag
Most HTML elements can have attributes
HTML Attributes
Attributes provide additional information about the
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.
Eg. <a href="http://www.w3schools.com">This is a
link</a>
HTML Styles
Styles was introduced to style HTML elements
using the style attribute, or indirectly in separate
style sheets (CSS)
Style Examples:
I. Background Color
II.Font Family, Color and Size
III.Text Alignment
HTML Links
Link syntax:
<a href="url">Link text</a>
A hyperlink is an address to a resource on the
web.
An anchor is a term used to define a hyperlink
destination inside a document.
The HTML anchor element <a>, is used to
define both hyperlinks and anchors.
HTML Images
In HTML, images are defined with the <img> tag.
To display an image on a page, you need to use the src
attribute. Src stands for "source". The value of the src attribute
is the URL of the image
The syntax of defining an image:
<img src="url" />
The browser puts the image where the image tag occurs in the
document.
The alt attribute is used to define an "alternate text" for an
image. The "alt" attribute gives information of what is missing on
a page if the browser can't load images.
HTML Tables
Tables are defined with the <table> tag. A table
is divided into rows (with <tr> tag), and each
row is divided into data cells (with <td> tag)
where td stands for "table data," which is the
content of a data cell.
Headings in a Table
Headings in a table are defined with the <th>
tag.
HTML Lists
Unordered Lists
An unordered list is a list of items marked with
bullets.
An unordered list starts with the <ul> tag. Each
list item starts with the <li> tag.
<ul>
<li>Coffee</li>
</ul>
Coffee
Ordered Lists
An ordered list is also a list of items marked
with numbers.
An ordered list starts with the <ol> tag. Each list
item starts with the <li> tag.
<ol>
<li>Coffee</li>
</ol>
1.Coffee
Definition Lists
A definition list is not a list of single items. It is a list of items
with a description of each item.
A definition list starts with a <dl> tag (definition list).
Each term starts with a <dt> tag (definition term).
Each description starts with a <dd> tag (definition description).
<dl>
<dt>Coffee</dt>
<dd>Black hot drink</dd>
</dl>
Coffee
Black hot drink
HTML Colors
HTML colors are defined using a hexadecimal notation
for the combination of Red, Green, and Blue color
values.
The lowest value to the light sources is 0 and highest
value is 255.
Hex values are written as 3 double digit numbers,
starting with a # sign.
It gives a total of more than 16 million different colors
to play with (256 x 256 x 256).
HTML Frames
With frames, we can display more than one HTML document in
the same browser window. Each HTML document is called a
frame, and each frame is independent of the others.
The <frameset> tag defines how to divide the window into
frames
The <frame> tag defines what HTML document to put into each
frame
The disadvantages of using frames are:
I. The web developer must keep track of more HTML documents
II. It is difficult to print the entire page
TAG
DESCRIPTION
<!--...-->
Defines a comment
<!DOCTYPE>
<a>
Defines an anchor
<abbr>
Defines an abbreviation
<acronym>
Defines an acronym
<address>
<applet>
<area />
<b>
<base />
<basefont />
Deprecated. Defines a default font, color, or size for the text in a page
<bdo>
<big>
<blockquote>
<body>
<br />
STF
<caption>
<center>
<cite>
Defines a citation
<code>
<col />
<colgroup>
<dd>
<del>
<dfn>
<dir>
<div>
<dl>
<dt>
<em>
<fieldset>
<font>
<form>
<h1> to <h6>
<head>
<hr />
<html>
<i>
<iframe>
<img />
Defines an image
<input />
<ins>
<isindex>
<kbd>
<label>
<legend>
<li>
<link />
<map>
Defines an image-map
<noscript>
<object>
<ol>
<optgroup>
<option>
<p>
Defines a paragraph
<param />
<pre>
<q>
<s>
<samp>
<script>
<select>
<small>
<span>
<strike>
<style>
<sub>
<sup>
<table>
Defines a table
<tbody>
<td>
<textarea>
<tfoot>
<th>
<thead>
<title>
<tr>
<tt>
<u>
<ul>
THANK YOU