By
Sudha Agarwal
INDEX
Introduction HTML Comments
HTML Definition & useful Editors HTML Links
HTML Tags & Elements HTML Images
Page Structure HTML Tables
HTML Headings HTML Blocks
HTML Attributes HTML Lists
HTML Headings HTML Colors
HTML Paragraphs HTML Classes
HTML Formatting HTML Head
History of web standards
HTML1
HTML2 HTML4 /
CSS2 / DOM
HTML5
CSS3
CSS1 / JS APIs
91-92
93-94
97-98
95-96 AJAX
2010
2006
What is html
HTML stands for HyperText Markup Language
Hypertext refers to the way in which Web pages (HTML
documents) are linked together. Thus the link available on a webpage
are called Hypertext.
Markup means you use HTML to simply "mark
up" a text document with tags that tell a Web browser
how to structure it to display.
Language : Every webpage we look at, is written
in a language called HTML. We can think of HTML
as the skeleton that gives every webpage structure.
Choosing Editor
HTML files can be created with text editors
NotePad, NotePad ++, EditPlus
HTML editors
Microsoft FrontPage
Macromedia Dreamweaver
Netscape Composer
Visual Studio
Browser
The most popular web browsers are Google
Chrome, Internet Explorer) Safari, Opera and
Firefox.
HTML Page Structure
<html>
<head>
<title> Page Title </title>
</head>
<body>
<h1> This is heading </h1>
<p> This is paragraph </p>
<p> This is paragraph </p>
</body>
<html>
HTML Page STrucTure……
Each web page has a HEAD and a BODY.
All web pages have required tags like these:
<HTML> {beginning of page}
<HEAD>
{Any set up instructions can go here}
</HEAD>
<BODY>
{This is main part of the page}
</BODY>
</HTML> {end of page}
<!DOCTYPE ....>
The <!DOCTYPE> declaration must be the very first thing in your
HTML document, before the <html> tag.
The <!DOCTYPE> declaration is not an HTML tag; it is an
instruction to the web browser about what version of HTML the page
is written in.
Differences Between HTML 4.01 and HTML5
There are three different <!DOCTYPE> declarations in HTML
4.01. In HTML5 there is only one:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML
4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<!DOCTYPE HTML>
The <head> Section
Includes information that does not show directly on the resulting
page
Starts after <!doctype> declaration
Begins with <head> and ends with </head>
Contains mandatory single <title> tag
Can contain other tags also, e.g.
<meta>
<script>
<style>
<!–- comments -->
<head> Section: <title> tag
The <title> tags encapsulate the title of our page.
The title is shown in top of our browser window when the page is
loaded.
<title>HTML Session </title>
<head> Section: <meta> tag
Meta tags are used to pass information or technical data for search
engines that will not be seen by the end user
Includes Page description, keywords, author of the document, last
modified and other metadata
<head>
<meta name="description" content=“HTML
Tutorial">
<meta name="keywords"
content="HTML,CSS,XML,JavaScript">
<meta name="author" content=“Sudha">
<meta http-equiv="content-type"
content="text/html; charset=UTF-8">
<meta http-equiv="refresh" content="5;
url=http://www.abc.com" />
</head>
<meta charset="UTF-8">
<body> Section
The <body> section describes the viewable portion of the page
Starts after the <head> </head> section
Begins with <body> and ends with </body>
<html>
<head><title>Test page</title></head>
<body>
<!-- This is the Web page body -->
</body>
</html>
HTML Tags
HTML tags are keywords (tag names) surrounded by angle brackets
HTML tags normally come in pairs like
The first tag in a pair is the start tag, the second tag is the end tag
Html elements
HTML documents are made up by HTML elements
An HTML element is defined by starting tag, end tag & content in
between
<p> - opening paragraph tag
Element Content - “Training by Sudha….."
</p> - closing tag
A Complete HTML Element:
<p>Training by
Sudha.....</p>
HTML Tag vs. Element
Tags are used to mark up the Start & End of an HTML element
<p> </p>
An HTML element represents some kind of structure or semantics
<p>Hello world</p>
Example
Nested HTML Elements
We can have one HTML element inside another HTML element
Wrong
<strong> <em> </strong> </em>
<strong> <em> </em> </strong>
Correct
Html attributes
Web page customization begins with HTML attributes.
They are like blue print schematics informing the browser how to
render an HTML element.
Provide additional information about an element
Are always specified in the start tag
Come in name/value pairs like: name="value"
Lang attribute
The document language can be declared in the <html> tag.
The language is declared in the lang attribute.
Declaring a language is important for accessibility applications
(screen readers) and search engines:
<!DOCTYPE html>
<html lang="en-US">
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</body>
</html>
Core Attributes
The 4 core attributes used on majority of HTML elements are:
id - Uniquely identify any element within an HTML page
<p id="html">This is id attribute</p>
title - Gives a suggested title for the element
<h3 title="Hello HTML!">Title Attribute</h3>
class - Associate an element with a style sheet, and
specifies the class of it
class="className1 className2 className3"
style - Specify Cascading Style Sheet (CSS) rules within the
element
<p style="font-family:arial;
color:#FF0000;">Some text...</p>
HTML Attributes - example
<!DOCTYPE html>
<html>
<head>
<title>The style Attribute</title>
</head>
<body>
<h3 title="Hello HTML!">Title Attribute</h3>
<p id="html">This is id attribute</p>
<p class="class1">This is class attribute</p>
<p style="font-family:arial;
color:#FF0000;">Some text...</p>
</body>
</html>
HTML Attributes - example
<!DOCTYPE html>
<html>
<head>
<title>The style Attribute</title>
</head>
<body>
<h3 title="Hello HTML!">Title Attribute</h3>
<p id="html">This is id attribute</p>
<p class="class1">This is class attribute</p>
<p style="font-family:arial;
color:#FF0000;">Some text...</p>
</body>
</html>
HTML Headings
A heading in HTML is just a title or subtitle
Headings give structure to a web page
This structure is both visual and technical
Headings are defined with the <h1> to <h6> tags
<h1> defines the most important heading
<h6> defines the last important heading
Headings Are Important
HTML headings provide valuable information by highlighting
important topics and structure of document
Use HTML headings for headings only
Don't use headings to make text BIG or bold
Search engines uses our headings to index the structure and
content of our web pages
Users skim our pages by its headings. It is important to use
headings to show the document structure
h1 headings should be main headings, followed by h2 headings,
then the less important h3, and so on
Example
HTML Paragraphs
The <p> tag defines a paragraph.
This tag places a blank line above and below the text of the paragraph.
<p>This is a paragraph</p>
<p>This is another paragraph</p>
The <pre> tag 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
A pre element must have both a start tag and an end tag.
<pre>
My Bonnie lies over the ocean.
My Bonnie lies over the sea.
Oh, bring back my Bonnie to me.
</pre>
example
<!DOCTYPE HTML>
<html>
<head><title>Headings and
paragraphs</title></head>
<body>
<h1>Heading 1</h1>
<h2>Sub heading 2</h2>
<h3>Sub heading 3</h3>
<p>This is my first paragraph</p>
<p>This is my second paragraph</p>
<div style="background:skyblue">
This is a div</div>
</body>
</html>
example
<!DOCTYPE HTML>
<html>
<head><title>Headings and
paragraphs</title></head>
<body>
<h1>Heading 1</h1>
<h2>Sub heading 2</h2>
<h3>Sub heading 3</h3>
<p>This is my first paragraph</p>
<p>This is my second paragraph</p>
<div style="background:skyblue">
This is a div</div>
</body>
</html>
Text Formatting
Text formatting tags modify the text between the opening tag and
the closing tag
<b></b> bold
<i></i> italicized
<u></u> underlined
<sup></sup> Samples supersript
<sub></sub> Samplesubscript
<strong></strong> strong
<em></em> emphasized
<pre></pre> Preformatted text
<del></del> Deleted text – strike through
<mark> Marked/highlighted text
Example
HTML Comments
A comment is a way to control which lines of code are to be ignored
by the web browser and which lines of code to incorporate into your
web page.
The three main reasons why you may want your code to be
commented out or ignored.
Comment out elements temporarily
Write notes or reminders to yourself
Create notes for other scripting languages like JavaScript.
<!-- This is a comment -->
<p>This is a paragraph.</p>
<!– Additional information-->
Conditional Comments
Conditional comments only work in Internet Explorer (IE) on
Windows but they are ignored by other browsers.
They are supported from Explorer 5 onwards.
<!--[if IE 8]>
.... some HTML here ....
<![endif]-->
HTML Links
A link is a connection from one Web resource to another.
HTML links are actually HTML anchors constructed using anchor
tags (<a>).
Link to a document called form.html on the same server in the same
directory:
<a href="form.html">Fill Our Form</a>
Link to a document called parent.html on the same server in the
parent directory
<a href="../parent.html">Parent</a>
Link to a document called cat.html on the same server in the
subdirectory stuff
<a href="stuff/cat.html">Catalog</a>
HTML Links
Link to an external Web site
<a href="http://www.devbg.org">BASD</a>
Link to an e-mail address
<a href="mailto:
[email protected]?subject=Demo">
Please post query here (by e-mail only)</a>
Using an image as a link
<a href=" apply-now.html ">
<img src=“apply_now.gif" alt="HTML tutorial"
style="width:42px;height:42px;border:0">
</a>
HTML Links
Link to another location in the same document
<a href="#section1">Go to Introduction</a>
...
<h2 id="section1">Introduction</h2>
Link to a specific location in another document
<a href="chapter3.html#section3.1.1">Go to
Section 3.1.1</a>
<!–- In chapter3.html -->
...
<div id="section3.1.1">
<h3>3.1.1. Technical Background</h3>
</div>
Links – target attribute
The target attribute specifies where to open the linked document.
This example will open the linked document in a new browser
window or in a new tab:
<a href="form.html" target="_blank">Fill out
form</a>
Target Description
_blank Opens the linked document in a new window or tab
_self Opens the linked document in the same frame as it was clicked (this
is default)
_parent Opens the linked document in the parent frame
example
<a href="form.html">Fill Our Form</a> <br />
<a href="../parent.html">Parent</a> <br />
<a href="stuff/cat.html">Catalog</a> <br />
<a href="http://www.devbg.org"
target="_blank">BASD</a> <br />
<a href="mailto:
[email protected]?subject=Demo">
Please post query here (by e-mail only)</a>
<br />
<a href="apply-now.html"><img src="apply-now-
button.jpg” /></a> <br />
<a href="../english/index.html">Switch to
English version</a> <br />
example
<a href="form.html">Fill Our Form</a> <br />
<a href="../parent.html">Parent</a> <br />
<a href="stuff/cat.html">Catalog</a> <br />
<a href="http://www.devbg.org"
target="_blank">BASD</a> <br />
<a href="mailto:
[email protected]?subject=Demo">
Please post query here (by e-mail only)</a>
<br />
<a href="apply-now.html"><img src="apply-now-
button.jpg” /></a> <br />
<a href="../english/index.html">Switch to
English version</a> <br />
Example
example
links-to-same-document.html
<h1>Table of Contents</h1>
<p><a href="#section1">Introduction</a><br />
<a href="#section2">Some background</A><br />
<a href="#section2.1">Project History</a><br />
...the rest of the table of contents...
<!-- The document text follows here -->
<h2 id="section1">Introduction</h2>
... Section 1 follows here ...
<h2 id="section2">Some background</h2>
... Section 2 follows here ...
<h3 id="section2.1">Project History</h3>
... Section 2.1 follows here ...
example
links-to-same-document.html
<h1>Table of Contents</h1>
<p><a href="#section1">Introduction</a><br />
<a href="#section2">Some background</A><br />
<a href="#section2.1">Project History</a><br />
...the rest of the table of contents...
<!-- The document text follows here -->
<h2 id="section1">Introduction</h2>
... Section 1 follows here ...
<h2 id="section2">Some background</h2>
... Section 2 follows here ...
<h3 id="section2.1">Project History</h3>
... Section 2.1 follows here ...
Example
HTML images
Images are defined with the <img> tag.
<img src="/img/basd-logo.png">
Image attributes:
src Location of image file (relative or absolute)
alt Substitute text for display (e.g. in text mode)
height Number of pixels of the height
width Number of pixels of the width
border Size of border, 0 for no border
Example
HTML images
Alternatively, you can use width and height attributes
<img src="html5.gif" alt="HTML5 Icon" width="128"
height="128">
Both the width, height, and style attributes are valid in the latest
HTML5 standard.
It is better to use the style attribute. It prevents styles sheets from
changing the original size of images
HTML images
Alternatively, you can use width and height attributes
<img src="html5.gif" alt="HTML5 Icon" width="128"
height="128">
Both the width, height, and style attributes are valid in the latest
HTML5 standard.
Using style
It is better to use the style attribute. It prevents styles sheets from
attribute
changing the original size of images
Using height
& width att
HTML Tables
Tables provide a means to represent tabular data
A table is divided into rows and columns: these specify cells of table
Cells can contain text, images, links, other tables etc.
Tables comprised of several core tags:
Tables are defined with the <table> tag.
Tables are divided into table rows with the <tr> tag.
Table rows are divided into table data with the <td> tag.
A table row can also be divided into table headings with the <th> tag.
Table Headings
Table heading is defined
using <th> tag. This tag will
replace <td> tag, which is used
to represent actual data cell
By default, all major
browsers display table
headings as bold and centered
Border Attribute
If we do not specify a border for the table, it will be displayed without
borders.
A border can be added using the border attribute or using CSS
border property.
<table border="1">
<tr>
<td>Row 1, Column 1</td>
<td>Row 1, Column 2</td>
</tr>
<tr>
<td>Row 2, Column 1</td>
<td>Row 2, Column 2</td>
</tr>
</table>
Example Example
Css border property
A border can be added using the border attribute or using CSS
border property.
<style>
table, th, td {
border: 1px solid black;
}
</style>
<body>
<table>
<tr>
<td>Row 1, Column 1</td>
<td>Row 1, Column 2</td>
</tr>
</table>
</body>
Nested tables
Table data “cells” (<td>) can contain nested tables (tables within
tables)
<table border="5" bordercolor="red">
<tr>
<td>Fisrt Column of Outer Table</td>
<td>
<table border="5" bordercolor="green">
<tr>
<td>First row of Inner Table</td>
</tr>
<tr>
<td>Second row of Inner Table</td>
</tr>
</td>
</tr>
</table>
Nested tables
Table data “cells” (<td>) can contain nested tables (tables within
tables)
<table border="5" bordercolor="red">
<tr>
<td>Fisrt Column of Outer Table</td>
<td>
<table border="5" bordercolor="green">
<tr>
<td>First row of Inner Table</td>
</tr>
<tr>
<td>Second row of Inner Table</td>
</tr>
</td>
</tr>
</table>
Cellpadding &Cellspacing
Tables have two important attributes to adjust the white space in
table cells
cellspacing cellpadding
cell cell
cell cell
cell cell cell cell
Defines the empty space Defines the empty space
between cells around the cell content
Cellpadding &Cellspacing
Example
<html>
<head><title>Table Cells</title></head>
<body>
<table cellspacing="15" cellpadding="0">
<tr><td>First</td>
<td>Second</td></tr>
</table>
<br/>
<table cellspacing="0" cellpadding="10">
<tr><td>First</td><td>Second</td></tr>
</table>
</body>
</html>
Column and Row Span
Table cells have two important attributes
collspan rowspan
colspan="1" colspan="1" rowspan="2" rowspan="1"
cell[1,1] cell[1,2] cell[1,2]
cell[1,1]
cell[2,1] cell[2,1]
colspan="2" rowspan="1"
Defines how many Defines how many
columns the cell rows the cell
occupies occupies
Column and Row Span
Example
<table border="1">
<tr>
<th>Column 1</th>
<th>Column 2</th>
<th>Column 3</th>
</tr>
<tr><td rowspan="2">Row 1 Cell 1</td><td>Row 1
Cell 2</td><td>Row 1 Cell 3</td></tr>
<tr><td>Row 2 Cell 2</td><td>Row 2 Cell
3</td></tr>
<tr><td colspan="3">Row 3 Cell 1</td></tr>
</table>
Block and Inline Elements
A block-level element always starts on a new line and takes up the
full width available
Example of block level elements are:
<p>, <div>, <h1>, - <h6>, <ul>, <ol>, <dl>, <pre> etc.
Inline elements, on the other hand, can appear within sentences
and do not have to appear on a new line of their own.
Example of inline elements are:
<span>, <img>, <a>, <b>, <i>, <u>, <em>, <strong>, <sup>, <sub>,
<big>, <small>, <li> etc.
The <div> Element
The <div> element is often used as a layout tool, because it can
easily be positioned with CSS.
Often used as a container for other HTML elements.
It does not provide any visual change on the block but this has more
meaning when it is used with CSS.
<div style="background-color:black; color:white;
padding:20px;">
<h2>WhatsApp</h2>
<p>WhatsApp has recently announced, it wil
completely go free across the world </p>
</div>
The <div> Element
The <div> element is often used as a layout tool, because it can
easily be positioned with CSS.
Often used as a container for other HTML elements.
It does not provide any visual change on the block but this has more
meaning when it is used with CSS.
<div style="background-color:black; color:white;
padding:20px;">
<h2>WhatsApp</h2>
<p>WhatsApp has recently announced, it wil
completely go free across the world </p>
</div>
The <span> Element
<span> is an inline element and it can be used to group elements
for styling purposes
<span> is very much like a <div> element, but <div> is a block-level
element whereas a <span> is an inline element.
<h1>My <span style="color:red">Important</span>
Heading</h1>
Html lists
HTML offers web authors three ways for specifying lists of
information. All lists must contain one or more list elements. Lists may
contain:
<ul> - An unordered list. This will list items using plain bullets.
<ol> - An ordered list. This will use different schemes of
numbers to list your items.
<dl> - A definition list. This arranges your items in the same
way as they are arranged in a dictionary.
Unordered List: Ordered List:
• Item 1. First item
• Item 2. Second item
• Item 3. Third item
• Item 4. Fourth item
Unordered HTML Lists
An unordered list is a collection of related items that have no special
order or sequence.
Starts with the <ul> tag. Each list item starts with the <li> tag.
<ul style="list-style-type:disc">
<li>Apple</li>
<li>Orange</li>
<li>Pear</li>
</ul>
Unordered HTML Lists
An unordered list is a collection of related items that have no special
order or sequence.
Starts with the <ul> tag. Each list item starts with the <li> tag.
<ul style="list-style-type:disc">
<li>Apple</li>
<li>Orange</li>
<li>Pear</li>
</ul>
The Style Attribute
A style attribute can be added to an unordered list, to define the
style of the marker
Style Description
list-style-type:disc List items will be marked with bullets (default)
list-style-type:circle List items will be marked with circles
list-style-type:square List items will be marked with squares
list-style-type:none List items will not be marked
• Apple o Apple Apple
• Orange o Orange Orange
• Pear o Pear Pear
ordered HTML Lists
If we are required to put your items in a numbered list instead of
bulleted then HTML ordered list will be used.
This list is created by using <ol> tag.
The numbering starts at one and is incremented by one for each
successive ordered list element tagged with <li>.
<ol>
<li>Apple</li>
<li>Orange</li>
<li>Pear</li>
</ol>
ordered HTML Lists
If we are required to put your items in a numbered list instead of
bulleted then HTML ordered list will be used.
This list is created by using <ol> tag.
The numbering starts at one and is incremented by one for each
successive ordered list element tagged with <li>.
<ol>
<li>Apple</li>
<li>Orange</li>
<li>Pear</li>
</ol>
The type Attribute
A type attribute can be added to an ordered list, to define the type of
the marker:
Style Description
type="1" List items will be numbered with numbers (default)
type="A" List items will be numbered with uppercase letters
type="a" List items will be numbered with lowercase letters
type=“I" List items will be numbered with uppercase roman
numbers
type="i" List items will be numbered with lowercase roman
numbers
The type Attribute
Attribute values for type are 1, A, a, I, or i
1. Apple i. Apple
2. Orange a. Apple ii. Orange
3. Pear b. Orange iii. Pear
c. Pear
A. Apple I. Apple
B. Orange II. Orange
C. Pear III. Pear
ordered HTML Lists
HTML support a list style which is called definition lists where
entries are listed like in a dictionary or encyclopedia.
Definition List makes use of following three tags.
<dl> - Defines the start of the list
<dt> - A term
<dd> - Term definition
</dl> - Defines the end of the list
<dl>
<dt><b>HTML</b></dt>
<dd>This stands for Hyper Text Markup Language</dd>
<dt><b>HTTP</b></dt>
<dd>This stands for Hyper Text Transfer Protocol</dd>
</dl>
ordered HTML Lists
HTML support a list style which is called definition lists where
entries are listed like in a dictionary or encyclopedia.
Definition List makes use of following three tags.
<dl> - Defines the start of the list
<dt> - A term
<dd> - Term definition
</dl> - Defines the end of the list
<dl>
<dt><b>HTML</b></dt>
<dd>This stands for Hyper Text Markup Language</dd>
<dt><b>HTTP</b></dt>
<dd>This stands for Hyper Text Transfer Protocol</dd>
</dl>
Html colors
Colors in HTML can be specified by the following methods:
Hexadecimal colors: A hexadecimal color is specified with: #RRGGBB,
where the RR (red), GG (green) and BB (blue) hexadecimal integers
specify the components of the color. All values must be between 00 and
FF
RGB colors: An RGB color value is specified with: rgb(red, green, blue)
Color names: We can specify color names directly like green, blue or
red.
<h2 style="background-color:#FFFF00">
Color set by using HEX
</h2>
<h2 style="background-color:rgb(255,255,0)">
Color set by using RGB
</h2>
<h2 style="background-color:yellow">
Color set by using Name
</h2>
Html colors
Colors in HTML can be specified by the following methods:
Hexadecimal colors: A hexadecimal color is specified with: #RRGGBB,
where the RR (red), GG (green) and BB (blue) hexadecimal integers
specify the components of the color. All values must be between 00 and
FF
RGB colors: An RGB color value is specified with: rgb(red, green, blue)
Color names: We can specify color names directly like green, blue or
red.
<h2 style="background-color:#FFFF00">
Color set by using HEX
</h2>
<h2 style="background-color:rgb(255,255,0)">
Color set by using RGB
</h2>
<h2 style="background-color:yellow">
Color set by using Name
</h2>
Html class attribute
The HTML class attribute makes it possible to define equal styles
for elements with the same class name.
<head>
<style>
div.cities {
background-color: black;
color: white;
margin: 20px 0 20px 0;
padding: 20px;
}
</style>
</head>
<body>
<div class="cities"> ... </div>
<div class="cities“>... </div>
<div class="cities“>... </div>
Html head
The <head> element is a container for metadata (data about data)
and is placed between the <html> tag and the <body> tag.
HTML metadata is data about the HTML document. Metadata is not
displayed.
Metadata typically define the document title, character set, styles,
links, scripts, and other meta information.
The following tags describe metadata: <title>, <style>, <meta>,
<link>, <script>.
Html head
Style Description
<head> Defines information about the document
<title> Defines the title of a document
<link> Defines the relationship between a document and an
external resource
<meta> Defines metadata about an HTML document
<script> Defines a client-side script
<style> Defines style information for a document
The HTML <title> Element
The <title> element defines the title of the document, and is required
in all HTML/XHTML documents.
defines a title in the browser tab
provides a title for the page when it is added to favorites
displays a title for the page in search engine results
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
The content of the document......
</body>
</html>
The HTML <meta> Element
The <meta> element is used to specify which character set is used,
page description, keywords, author, and other metadata.
Metadata is used by browsers (how to display content), by search
engines (keywords), and other web services.
Define the character set used:
<meta charset="UTF-8">
Define a description of your web page:
<meta name="description" content="HTML
tutorials">
Define keywords for search engines:
<meta name="keywords" content="HTML, CSS, XML,
JavaScript">
The HTML <meta> Element
Define the author of a page:
<meta name="author" content="Sudha Agarwal">
Revision
Markup tags tell the web browser
a) How to organize the page
b) How to display the page
c) How to display message box on the page
d) None of these
From which tag descriptive list starts
a) <LL>
b) <DD>
c) <DL>
d) <DS>
How can you make an email link
a) <mail href + “
[email protected]”>
b) <a href = “mail to:
[email protected]”>
c) <a href = “
[email protected]”>
d) Both (b) and (c).
Revision
Markup tags tell the web browser
a) How to organize the page
b) How to display the page
c) How to display message box on the page
d) None of these
From which tag descriptive list starts
a) <LL>
b) <DD>
c) <DL>
d) <DS>
How can you make an email link
a) <mail href + “
[email protected]”>
b) <a href = “mail to:
[email protected]”>
c) <a href = “
[email protected]”>
d) Both (b) and (c).
Revision
What is the correct HTML for creating a hyperlink?
a) <a href="http://www.w3schools.com">W3Schools</a>
b) <a>http://www.w3schools.com</a>
c) <a url="http://www.w3schools.com">W3Schools.com</a>
d) <a name="http://www.w3schools.com">W3Schools.com</a>
Which HTML attribute specifies an alternate text for an image, if the
image cannot be displayed?
a) src
b) alt
c) longdesc
d) title
Which of these elements are all <table> elements?
a) <table><tr><td>
b) <thead><body><tr>
c) <table><tr><tt>
d) <table><head><tfoot>
Revision
What is the correct HTML for creating a hyperlink?
a) <a href="http://www.w3schools.com">W3Schools</a>
b) <a>http://www.w3schools.com</a>
c) <a url="http://www.w3schools.com">W3Schools.com</a>
d) <a name="http://www.w3schools.com">W3Schools.com</a>
Which HTML attribute specifies an alternate text for an image, if the
image cannot be displayed?
a) src
b) alt
c) longdesc
d) title
Which of these elements are all <table> elements?
a) <table><tr><td>
b) <thead><body><tr>
c) <table><tr><tt>
d) <table><head><tfoot>
Revision
Which tag is used to lists the items with bullets?
a) <bullet>…</bullet>
b) <list>…</list>
c) <ul>…</ul>
d) <ol>…</ol>
Which of the following is the correct regarding meta tag in HTML?
a) <meta> … </meta>
b) <meta name = ” ” />
c) <metadata> … </metadata>
d) <metadata name = ” ” />
Revision
Which tag is used to lists the items with bullets?
a) <bullet>…</bullet>
b) <list>…</list>
c) <ul>…</ul>
d) <ol>…</ol>
Which of the following is the correct regarding meta tag in HTML?
a) <meta> … </meta>
b) <meta name = ” ” />
c) <metadata> … </metadata>
d) <metadata name = ” ” />
Thank you!
Contact Us
[email protected]
