1. The Mother Tongue of The Browser
HTML
The Mother Tongue of The Browser

2. Web Site

3. World Wide Web
The World Wide Web (Web) is a network of information resources.
The Web relies on three mechanisms to make these resources readily available to the widest possible audience:
A uniform naming scheme for locating resources on the Web (e.g., URLs).
Protocols, for access to named resources over the Web (e.g., HTTP).
Hypertext, for easy navigation among resources (e.g., HTML).
URI: Uniform Resource Identifiers
URL: Uniform Resource Locators
URN: Uniform Resource Names
http: protocol used by www client to request page from www server

4. Web Programming Programming for the World Wide Web involves both
server-side programming, and
client-side (browser-side) programming.
The publishing language used by the World Wide Web is HTML.

5. Web Programming
Servers make web documents, which are specified in HTML, available on request to browsers.
Browsers display, to users, web documents which have been received from servers.

6. HTML Background HTML stands for “Hyper Text Mark-up Language”.
The language used to design Web Page.
HTML was invented in 1990 by a scientist called Tim Berners-Lee. The purpose was to make it easier for scientists at different universities to gain access to each other's research documents.
HTML standards are organized by W3C :
To make a long story short, HTML was invented in 1990 by a scientist called Tim Berners-Lee, popularized by the Mosaic browser developed at NCSA. . The purpose was to make it easier for scientists at different universities to gain access to each other's research documents. The project became a bigger success than Tim Berners-Lee had ever imagined. By inventing HTML he laid the foundation for the web as we know it today. (used for specifying WWW documents).
The Web depends on Web page authors and vendors sharing the same conventions for HTML. This has motivated joint work on specifications for HTML.

7. Hyper-Text-Markup-Language
Hyper is the method by which you move around on the web.
Text is self-explanatory.
Mark-up is what you do with the text. You are marking up the text the same way you do in a text editing program with headings, bullets and bold text and so on.
Language is what HTML is. It uses many English words.
Simply, HTML is a Language, as it has code-words and syntax like any other language.
Hyper:is the opposite of linear. In the good old days - when a mouse was something the cat chased - computer programs ran linearly: when the program had executed one action it went to the next line and after that, the next line and so on. But HTML is different - you can go wherever you want and whenever you want. For example, it is not necessary to visit MSN.com before you visit HTML.net.
The definition of HTML is HyperText Markup Language.
HyperText is the method by which you move around on the web — by clicking on special text called hyperlinks which bring you to the next page. The fact that it is hyper just means it is not linear — i.e. you can go to any place on the Internet whenever you want by clicking on links — there is no set order to do things in.
Markup is what HTML tags do to the text inside them. They mark it as a certain type of text (italicised text, for example).
HTML is a Language, as it has code-words and syntax like any other language

8. HTML HTML is used for creating static web pages.
It is designed to display data & focus on how data looks.
HTML’s role on the web is to tell the browser how a document should appear.
HTML was the only language one could use to create Web pages.
HTML is about displaying information.
HTML (Hypertext Markup Language) is the set of markup symbols or codes inserted in a file intended for display on a World Wide Web browser page. The markup tells the
Web browser how to display a Web page's words and images for the user. Each individual markup code is referred to as an element (but many people also refer to it as
a tag). Some elements come in pairs that indicate when some display effect is to begin and when it is to end.
HTML is a formal Recommendation by the World Wide Web Consortium (W3C) and is generally adhered to by the major browsers, Microsoft's Internet Explorer and Netscape's Navigator, which also provide some additional non-standard codes. The current version of HTML is HTML 4.0. However, both Internet Explorer and Netscape implement some features differently and provide non-standard extensions. Web developers using the more advanced features of HTML 4 may have to design pages for both browsers and send out the appropriate version to a user. Significant features in HTML 4 are sometimes described in general as dynamic HTML. What is sometimes referred to as HTML 5 is an extensible form of HTML called Extensible Hypertext Markup Language (XHTML).
----
A specification, in HTML, of a WWW document contains raw content (text, video, etc.) along with items called tags which are used to tell browsers about the content.
Now, most computer users, whether they use Windows, Macintosh, UNIX or some combination thereof, are accustomed to graphical application interfaces.
This increase in user abilities and expectations has resulted in a continual improvement of HTML and in the advent of powerful scripting languages, such as JavaScript
Purpose  tell the browser how a document should appear
Static  can view or print (no interaction)

9. HTML Functionalities HTML gives authors the means to:
Publish online documents with headings, text, tables, lists, photos, etc.
Include spread-sheets, video clips, sound clips, and other applications directly in their documents.
Link information via hypertext links, at the click of a button.
Design forms for conducting transactions with remote services, for use in searching for information, making reservations, ordering products, etc.

10. HTML Versions
HTML 2.0 was developed by the IETF's HTML Working Group, which set the standard for core HTML features based upon current practice in 1994.
HTML 3.2 was W3C's first Recommendation for HTML on January 14, 1997.
HTML 4.0 was first released as a W3C Recommendation on December 18 ,1997.
HTML 4.01 is a revision of the HTML 4.0 became a W3C Recommendation December 24, 1999.
XHTML is a stricter and cleaner version of HTML.
HTML5 is the next major version of HTML.
HTML Versions
HTML 2.0
IETF’s Internet Engineering Task Force HTML Working.
HTML 3.2
HTML 3.2 contained new features such as fonts, tables, applets, superscripts, subscripts and more, to the existing HTML 2.0 standard.
One of the elements added to the HTML 3.2 standard, was the <font> tag. This tag introduced unnecessary complexity to the important task of separating HTML content (text) from its presentation (style).
HTML 4.0
The most important feature of HTML 4.0 was the introduction of style sheets (CSS). 
The <font> tag became deprecated in HTML 4.0. 
Our W3C CSS chapter summarizes the W3C CSS activities.
HTML 4.01
HTML 4.01 was a minor update of corrections and bug-fixes from HTML 4.0.

11. Sample Webpage

12. Sample Webpage HTML Structure
Title tags
<html>
<head>
<title>First Demo</title>
</head>
<body>
<p>Welcome all</p>
<!-- The content of the document -->
</body>
</html>
Body tags

13. HTML Basic Structure An HTML document is divided into a
HTML documents contain text and various tags that define elements such as headings, paragraphs and Hyperlinks.
Each element describes how the document should be displayed.
An HTML document is divided into a
head section
The title of the document appears in the head (along with other information about the document).
body section
The content of the document appears in the body.

14. HTML Element Syntax HTML elements can have attributes.
<start_of_tag attribute_name=“attribute value”>
Content
</end_of_tag>
HTML elements can have 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“.
Each element has a number of properties associated with it:
An HTML element starts with a start tag / opening tag.
An HTML element 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.
Empty elements are closed in the start tag.
Most HTML elements can have attributes.
HTML documents consist of nested HTML elements.
Most elements can contain other HTML elements.
The start tag is often called the opening tag. The end tag is often called the closing tag.
example,
<b>Hello</b> world
Hi <i>Ahmed</i> Ali
<hr><br>
<b><i>Hello</i></b> world

15. General Element Attributes
Core Attributes
Not valid in base, head, html, meta, script, style, and title elements.
Attribute
Value
Description
class
classname
Specifies a classname for an element id
Specifies a unique id for an element
style
style_definition
Specifies an inline style for an element
title
text 
Specifies extra information about an element

16. HTML Document Elements Hierarchy
head
body
title
meta
script
style p
h1-h6
anchor
form
image
tables
style
script
button
input
label
legend
select
textarea
    Head     
     Body     

17. <meta> Tag
Meta tags are used to store information usually relevant to browsers and search engines.
Define the author of the document as well as the content of the webpage.
provides additional information about the page; for example, which character encoding the page uses, a summary of the page’s content, instructions to search engines about whether or not to index content, and so on.
<meta name="description" content="an html tutorial“ />
<meta name="keywords" content="html, webdesign, javascript“ />
<meta name="author" content="bill gates“ />
<meta http-equiv="refresh" content="5; url= />
<META http-equiv="Content-Type" content="text/html; charset=windows-1256“ />
<META name="GENERATOR" content="Frontpage 3.0“ />
<META name="AUTHOR" content="Bill Gates“ />
Example!

18. Inside <body> Section
Text
Formatting
Resizing
Layout
Listing
Images
Inserting images (GIF & jpg)
Adding a link to an image
Links
To local pages
To pages at other sites
To bookmarks
Background
Colors
Images
Tables
Frames
Forms
Fixed Images

19. HTML Text The <font> tag will change the font.
<font color="red" face="arial" size="2"> This local text looks different. </font>
<font size="1">text</font> writes text in smallest font size. (8 pt)
<font size="7">text</font> writes text in biggest font size (36 pt)

20. Text Format Appearance
Tag
Description
<b>text</b>
writes text as bold
<i>text</i>
writes text in italics
<u>text</u>
writes underlined text
<strike>text</strike>
strikes a line through the text
<strong>text<strong>
usually makes text bold

21. Text Size Appearance Tag Description <big>text</big>
increase the size by one
<small>text</small>
decrease the size by one
<h1>text</h1>
writes text in biggest heading
<h6>text</h6>
writes text in smallest heading
<hr/>
Defines a horizontal line ??

22. Text Layout Tag Description <p>text</p>
Adds a paragraph break after the text. (2 linebreaks).
<p align="left|center|right"> text </p>
Left justify text in paragraph.
text<br/>
Adds a single linebreak where the tag is.
<center>text</center>
Center text.
<div align="left|center|right "> text</div>
Defines a section in a document.
Note:dir can be used instead of align ??

23. HTML Lists HTML supports ordered “Numbered” lists,
unordered “Bulleted” lists and
definition lists.

24. Numbered List Attribute Value Description start number
Use styles instead.
Specifies the start point in a list
type
Number
Capital letter
Small letter
Capital Roman #
Small Roman #
Specifies which kind of bullet
points will be used
<ol start="5">
<li>text</li>
</ol>
<ol type=“A">
<li>text</li>
</ol>

25. Bulleted Lists You have the following bullet options: disc circle
square
<ul type=“circle”> <li>text</li> <li>text</li> </ul>
<ul type="disc">
<ul type="circle"> <ul type="square">

26. Definition List
The <dd> tag is used to describe an item in a definition list.
The <dd> tag is used in conjunction with <dl> (defines the definition list) and <dt> (defines the item in the list).
<dl>   <dt>Coffee</dt>     <dd>- black hot drink</dd>   <dt>Milk</dt>     <dd>- white cold drink</dd> </dl>
Inside a <dd> tag you can put paragraphs, line breaks, images, links, lists, etc.
Example!

27. HTML Images Images types used in browsers are : .gif & .jpg Resizing
<img src=“" width="" height="“ align=“” alt=“” hspace="" vspace="">
Images types used in browsers are : .gif & .jpg
<img src=“abc.gif">
<img src=“
Resizing
<img src=“abc.gif" width="60" height="60">
default aligns the image using the default settings of the Web browser. Same as baseline.
left aligns the image in the left margin and wraps the text that follows the image.
right aligns the image in the right margin and wraps the text that precedes the image.
top aligns the top of the image with the surrounding text.
texttop aligns the top of the image with the top of the tallest text in the line.
middle aligns the middle of the image with the surrounding text.
absmiddle aligns the image with the middle of the current line.
baseline aligns the image with the baseline of the current line.
bottom aligns the bottom of the image with the surrounding text.
absbottom aligns the image with the bottom of the current line.
center aligns the center of the image with the surrounding text.

28. HTML Images Alignment of Images Alternative Text
You can align images according to the text around it Default, left, right, top, texttop, middle, center.
Alternative Text
<img src=“logo.gif" alt="This is a text that goes with the image">
Example!

29. <a href="url“ target=“”>Link text</a>
 HTML Links
<a href="url“ target=“”>Link text</a>
Click <a href=" to go to yahoo.
Link targets
<a href=" target="_blank">
Image link
<a href="myfile.htm"><img src="rainbow.gif"></a>
The target can be one of the following Values to identify where the link is loaded :
"_blank“ Loads the link into a new blank window.
"_self“  Loads the link into the same window. (default)

30. HTML Links Link to email
<a href="mailto:your address"> Me</a>
<a </a>

31. HTML Links Link Within a Page To link to an anchor you need to:
Create a link pointing to the anchor
Create the anchor itself.
<a name =“chapter4”></a>
Click <a href=“# chapter4”>here</a> to read chapter 4
<a name =“top”></a>
Click <a href=“#top”>Top</a>
Example!

32. <marquee> Tag
<marquee attribute1 attribute2>moving text< / marquee > (IE) Places a scrolling text marquee into the document.
Example!

33. Forms

34. Sample Form Design

35. HTML Forms <form> Main Attributes action=address
<form> <!-- Here goes form fields and HTML --> </form>
<form> Main Attributes
action=address
Specifies where to send the form-data when a form is submitted.
method=post or method=get
Specifies how to send form-data.
The <fieldset> tag is used to logically group together elements in a form.
The <fieldset> tag draws a box around the related form elements.
The <legend> tag defines a caption for the fieldset element.

36. Form Fields A <form> can contain <input> elements:
Text field
Password field
Hidden field
Check box
File
Submit button
Reset button
Image button
Radio button
Other elements:
<textarea>
<label>
Drop-down menu
like text fields, checkboxes, radio-buttons, submit buttons and more. A forms can also contain select menus, textarea, fieldset, legend, and label elements.

37. <input> Text Field Attributes
size
maxlength
name
value
align
tabindex: Specifies the tab order of an element.
<input type="text" size="25" value="Enter your name here!">

38. <input> Password Field Attributes
size
maxlength
name
value
align
tabindex
Enter Password : <input type="password" size="25">

39. <input> file Field
Used for file uploads.
When used, two controls appear in the browser:
a field that looks similar to a text input, and
a button control that’s labeled Browse…. The text that appears on this button can’t be changed.
accept attribute, is used to define the kinds of files that may be uploaded.
Browser support for this attribute is inconsistent, however, the job of validating file uploads is best left to the server.
<input type="file" name="picture" id="picture“ accept="image/jpeg, image/gif"/>
File is poorly supported and should not be relied upon

40. <textarea> Field Attributes
rows
cols
Name
tabindex
readonly
disabled
<textarea cols="40" rows="5" name="myname"> Now we are inside the area - which is nice. </textarea>

41. <input> Checkbox Field Attributes
name
value
align
tabindex
Checked
<input type="checkbox" name="option1" value="Milk"> Milk<br>
<input type="checkbox" name="option2" value="Butter" checked> Butter<br>

42. <input> Radio Button Field Attributes
name
value
align
tabindex
checked
<input type="radio" name="group1" value="Milk"> Milk<br>
<input type="radio" name="group1" value="Butter" checked =“checked”> Butter<br>
<input type="radio" name="group1" value="Cheese"> Cheese

43. Drop-Down Menu Tags <select> Attributes
name
size
multiple
<option> Attributes
selected
value
<select>   <option>Milk</option>   <option selected>Coffee</option>   <option>Tea</option>
</select>
Size: make list box but allow you to choose only one item.
Multiple: make list box and allow you to choose many items.

44. <input> Submit button / Reset button Attributes
name
value
align
tabindex
<input type="button" value="Hello world!"> 

45. <input> Image button
Image buttons have the same effect as submit buttons
Attributes
name
src
align
border
width
Height
tabindex
<input type="image" src=“abc.gif" name="image" width="60" height="60">
Example!

46. Frames

47. Sample Web Page Designed Using Frames

48. Frames Frames allow multi-windowed layout.
i.e. splitting a single Web page into multiple windows, each of which can open a different document.
Frames are independent, scrollable portions of a Web browser window, with each frame capable of displaying a different document.

49. Frames Tags Tag Description <frameset> Defines a set of frames
Defines a sub window (a frame)
<noframes>
Defines a noframe section for browsers that do not handle frames
<iframe>
Defines an inline sub window (frame)

50. HTML <frame> Attributes
Value
Description
Frameborder 1
Specifies whether or not to display a border around a frame
Marginheight
pixels
Specifies the top and bottom margins of a frame
Marginwidth
Specifies the left and right margins of a frame
name
Specifies the name of a frame
noresize
Specifies that a frame cannot be resized
scrolling
Yes
no auto
Specifies whether or not to display scrollbars in a frame
Height
Pixel | %
Set height of frame
Width
Set width of frame
Bordercolor
rgb(x,x,x) #xxxxxx colorname
sets color for the border of frame
src
URL
Specifies the URL of the document to show in a frame
longdesc URL Specifies a page that contains a long description of the content of a frame

51. HTML <frameset> Attributes
Description
border
Define border width of frames inside frameset.
=pixel count
Frameborder
Controles border of frames whether to display a border or not
Yes | no
Cols
(pixels,%,*)
Specifies the number and size of columns of frame in a frameset
Rows
Specifies the number and size of rows of frame in a frameset
framespacing
Spacing in pixels between frames

52. Web Page Design 4) address and phone number 1) newspaper logo
2) list of
links
3) articles
620 pixels
500 pixels
120 pixels

53. Creating Frames
You divide a document into frames using the <frameset> element.
The <frame> element and other <frameset> elements are the only items that you can place inside a <frameset> element.

54. Creating Frames
Two attributes of the <frameset> element, rows and cols, determine whether frames are created as rows or columns
The rows attribute determines the number of horizontal frames to create
The cols attribute determines the number of vertical frames to create
The src attribute of the <frame> element specifies the document to be opened in an individual frame

55. HTML Frames
<frameset rows=“*,50%" cols="50%,*"> <frame src="" name="topleft"> <frame src="" name="topright"> <frame src="" name="botleft"> <frame src="" name="botright">
</frameset>
Top left
Top right
Bottom left
Bottom right

56. Nesting Frames
Each individual frame within a window can contain its own set of frames.
Frames that are contained within other frames are called nested frames.
Nested frames accomplished by including a <frameset> element inside another <frameset> element.

57. Nested Frames
<frameset rows="50%,50%" cols="50%,50%" border="5" >
<frame src="" name="topleft" bordercolor="red" scrolling="no“ />
<frameset rows="50%,50%" cols="50%,50%" border="5“ />
<frame src="" name="botleft" bordercolor="red" scrolling="no“ />
<frame src="" name="botright" bordercolor="red" scrolling="no“ />
</frameset>

58. Using the target Attribute & <base> Element
One popular use of frames creates a table of contents frame on the left side of a Web browser window with a display frame on the right side.
The target attribute determines in which frame or Web browser window a document opens.
When you are using the same target window or frame for a long list of hyperlinks, it is easier to use the target attribute in the <base> element instead of repeating the target attribute within each hyperlink.
You use the target attribute with the <base> element to specify a default target for all links in a document, using the assigned name of a window or frame.

59. Links Within Frames
Jump to the <a href="analysis.htm" target="main">Analysis</a> of the project
The target can be a name of a frame that you specified in the <frame> tag or one of the following Values:
"_blank“ Loads the link into a new blank window.
"_parent“ Loads the link into the immediate parent of the document the link is in.
"_self“  Loads the link into the same window. (default)
"_top“ Loads the link into the full body of the current window.

60. Frames Disadvantage
The web developer must keep track of more HTML documents.
It is difficult to print the entire page.
Frames are less used in modern-day web design, they’re still valid, and there are still many web sites that use these elements today as they have for years.

61. Tables

62. Table

63. Table Tags Tag Description <table> Defines a table.
<caption>
Defines a table caption. Provides a means for labeling
the table’s content. Used once per table and must
immediately follow the table start tag.
<th>
Defines a header cell in a table
<tr>
Defines a row in a table
<td>
Defines a cell in a table
<thead>
Groups the header content in a table. By default, a
thead will not affect the display of the table in any way.
<tbody>
Groups the body content in a table
<tfoot>
Groups the footer content in a table

64. Using of <table>,<tr> & <td> Tags
Graphical tables are enclosed within a two-sided <table> tag that identifies the start and ending of the table structure.
Each row of the table is indicated using a two-sided <tr> (for table row).
Within each table row, a two-sided <td> (for table data) tag indicates the presence of individual table cells.

65. Columns Within a Table HTML does not provide a tag for table columns.
In the original HTML specifications, the number of columns is determined by how many cells are inserted within each row.
i.e. if a table have four <td> tags in each row, then it has has four columns.
<col/> Defines attribute values for one or more columns in a table
<colgroup> Defines a group of columns in a table for formatting

66. The Table Syntax This creates a table with two rows and two columns.
<tr>
<td> First Cell </td>
<td> Second Cell </td>
</tr>
<td> Third Cell </td>
<td> Fourth Cell </td>
</table>
This creates a table with two rows and two columns.
two rows
two columns

67. Adding Headings to Table
<table border="2" bordercolorlight="#b2b2ff">
<tr bordercolor="red">
<th>First Col</th>
<th>second Col</th>
</tr>
<tr>
<td> First Cell </td>
<td> Second Cell </td>
<td> Third Cell </td>
<td> Fourth Cell </td>
</table>
HTML provides the <th> tag for table headings.
Text formatted with the <th> tag is centered within the cell and displayed in a boldface font.
The <th> tag is most often used for column headings, but you can use it for any cell that you want to contain centered boldfaced text.

68. Adding <caption> to Table
<table border="2" bordercolorlight=“yellow” cellpadding=10 >
<caption>Demonstrating Table with header & caption</caption>
<tr bordercolor="red">
<th>First Col</th>
<th>second Col</th>
</tr>
<tr>
<td> First Cell </td>
<td> Second Cell </td>
<td> Third Cell </td>
<td> Fourth Cell </td>
</table>
HTML provides the <th> tag for table headings.
Text formatted with the <th> tag is centered within the cell and displayed in a boldface font.
The <th> tag is most often used for column headings, but you can use it for any cell that you want to contain centered boldfaced text.

69. The <table> Tag Attributes
Description
Bgcolor
like with the body tag, this sets the background color of any item.
It works with tables as well and will be seen as the default color.
Width
determines the width of the table and isn’t required. If you don’t
put this in, the table will automatically adjust in terms of width.
Height
it’s mainly for the height and how high you want the table to be.
Not required at all and will adjust on its own if not with a set
height.
Border
determines the borders from outside the table to the table cells
and isn’t required. By default, browsers display tables without
table borders, i.e. its default value is 0.
Cellpadding
it’s the distance of the cell wall from the contents.
Cellspacing
sets the distance between cells and isn’t required. Again, it will
do that automatically if not set.
bordercolor
to set the color of the border.
Background can add a background image to the table. Only use this if you can make your text readable.

70. The <tr> Tag Attributes
Value
Description
align
Left
Right
Center
justify
Aligns the content in a cell
bgcolor
rgb(x,x,x) #xxxxxx colorname
Specifies a background color for a cell.
valign
Top
Middle
Bottom
baseline
Vertical aligns the content in a cell
background path can add a background image to the table. Only use this if you can make your text readable.

71. The <th>& <td> Tags Attributes
Value
Description
align
left |right | center | justify
Aligns the content in a cell
bgcolor
rgb(x,x,x) #xxxxxx colorname
Specifies a background color for a cell.
colspan
Number
Sets the number of columns a cell should span
height
pixels | %
Sets the height of a cell
rowspan
Sets the number of rows a cell should span
valign
top | middle | bottom |baseline
Vertical aligns the content in a cell
width
Specifies the width of a cell
Background  path can add a background image to the table. Only use this if you can make your text readable.

72. Defining Cell and Column Sizes
To set the width of an individual cell, add the width attribute to either the <td> or <th> tags.
The syntax is: width=“value”
value can be expressed either in pixels or as a percentage of the table width
a width value of 30% displays a cell that is 30% of the total width of the table
The height attribute can be used in the <td> or <th> tags to set the height of individual cells.
The height attribute is expressed either in pixels or as a percentage of the height of the table.
If you include more text than can be displayed within that height value you specify, the cell expands to display the additional text.

73. Spanning Rows and Columns
To merge several cells into one, you need to create a spanning cell.
A spanning cell is a cell that occupies more than one row or column in a table.
Spanning cells are created by inserting the rowspan and colspan attribute in a <td> or <th> tag.
The syntax for these attributes is: rowspan=“value” colspan=“value”
value is the number of rows or columns that the cell spans in the table

74. Example of Spanning Cells
this cell spans two columns
This cell spans three rows

75. Example of Spanning Cells
This cell spans two columns and two rows
this cell spans three columns
This cell spans three rows
This figure shows a table of opinion poll data in which some
of the cells span several rows and/or columns.

76. Designing a Page Layout with Tables
HTML tables are most often used to define the layout of an entire Web page.
If you want to design a page that displays text in newspaper style columns, or separates the page into distinct sections, you’ll find tables an essential and useful tool.
Remember that some monitors display Web pages at a resolution of 640 by 480 pixels.

77. Web Page Layout using Table

78. A Sample Web Page Design with Tables
Comment tags can aid in viewing your HTML file by describing the different sections of the code.
The syntax for creating a comment tag is:
<! Comment text>
comment text is the text that you want to insert into the comment
Any text appearing within the comment tag is ignored by the browser and not displayed in the page.

79. Web Page Using Nested Table
Tables can be created within another table making the Web page easier to manage.

80. A Sketch of a Web Page using Nested Tables
This figure shows a sketch of a web page using nested tables.

81. Changing The Table Text Size
In order to change the size of the table text, you need to insert a <font> tag into each cell.
Note: The <font> tag can not be applied to all of the text in a table.
As <font> tag is deprecated <style> tag is used instead.

82. Online References www.w3schools.com www.echoecho.com www.quackit.com …

83. Now Its Time To Do Your Web Right Now 