and to format text styles like bold and italics.
- Common page elements include headings, paragraphs, links, images and tables.
- Tags are used to define the structure and layout of the page.
- Attributes provide additional information about elements to control features like color, size and alignment.
- Basic HTML pages use tags like , , Introduction To HTML Introduction To HTML Of Physics The opening and closing tags use the same command except Whenever you have HTML tags within other HTML tags, you <!DOCTYPE html> <h1>This is a heading</h1> </body> https://www.w3schools.com/html/html_styles.asp <p>I am normal</p> </body> <h1 style="background-color:powderblue;">This is a </body> 5 scrolldelay 6 scrollamount 8 bgcolor 10 vspace <!DOCTYPE html> <body> <head> <body> </html> <head> <dl> TagDescription <head> FORMS Drop-down Menu Text Area Reset Button CREATING CHECKBOXES EXAMPLE: CHECKBOXES TABLES ADDING A BORDER <td>Austria</td> <td>Island Trading</td> <td>UK</td> <td>Mexico</td> </html> </tr> CENTERING A TABLE NESTING TABLES COLUMN GROUPSUploaded by
map281230Uploaded by
map281230Dept.
St. Mary’s College
HTML
WHAT IS HTML? HTML, otherwise known as Hyper Text Markup Language, is the
language used to create Web pages
Using HTML, you can create a Web page with text, graphics,
sound, and video
WEB PAGE A web page or webpage is a document, commonly written in
HTML, that is viewed in an Internet browser. A web page can be
accessed by entering a URL address into a browser's address
bar. A web page may contain text, graphics, and hyperlinks to
other web pages and files.
WHAT IS THE WWW? The world wide web ('www' or 'web' for short) is a collection
of webpages found on this network of computers.
Your web browser uses the internet to access the web.A distributed document delivery system
Uses a client-server model
Main presentation language is HTML
WEBPAGE
WEB BROWSER A web browser (commonly referred to as a browser) is a software
application for accessing information on the World Wide Web.
When a user requests a web page from a particular website, the
web browser retrieves the necessary content from a web
server and then displays the page on the user's device.
HTML
STRUCTURE OF A WEB PAGE
<!DOCTYPE html> All Web pages
<HTML>
share a common
<HEAD>
structure
<TITLE> Example </TITLE>
</HEAD> AllWeb pages
<BODY> should contain a
Start HTML pair of <HTML>,
</BODY> <HEAD>, <TITLE>,
</HTML> and <BODY> tags
<!DOCTYPE...>
This tag defines the document type and HTML version
TAGS The essence of HTML programming is tags
A tag is a keyword enclosed by angle brackets ( Example: <I> )
There are opening and closing tags for many but not all tags;
The affected text is between the two tags
the closing tag contains and additional forward slash /
For example, the expression <B> Warning </B> would cause
the word ‘Warning’ to appear in bold face on a Web page
NESTED TAGS
must close the nearest tag first
Example:
<H1> <I> The Nation </I> </H1>
THE <TITLE> TAG
Choose the title of your Web page carefully; The
title of a Web page determines its ranking in
certain search engines
The title will also appear on Favorite lists, History
lists, and Bookmark lists to identify your page
<TITLE/>
<html>
<head>
<title>HTML Elements Reference</title>
</head>
<body>
</html>
TEXT FORMATTING Manipulating text in HTML can be tricky; Oftentimes, what
you see is NOT what you get
For instance, special HTML tags are needed to create
paragraphs, move to the next line, and create headings
TEXT FORMATTING TAGS
<U> Underline </U>
<P> New Paragraph </P>
<BR> Next Line
<b> - Bold text</b>
<strong> - Important text</strong>
<i> - Italic text</i>
<em> - Emphasized text.
<mark> - Marked text </mark>
<small> - Smaller text</small>
<del> - Deleted text</del>
<ins> - Inserted text</ins>
<!DOCTYPE html>
<html>
<head>
<title>Text Example</title>
</head>
<body>
<p>The following word uses a <b>bold</b> typeface.</p>
<p>The following word uses an <i>italicized</i> typeface.</p>
<p>The following word uses an <u>underlined</u>
typeface.</p>
<p>The following word uses a <strike>strikethrough</strike>
typeface.</p>
</body>
</html>
HTML STYLES The HTML style attribute is used to add styles to an
element, such as color, font, size, and more
CHANGING THE FONT The expression <FONT FACE =
“fontname”> … </FONT> can be used to
change the font of the enclosed text
To change the size of text use the expression <FONT SIZE=n>
…. </FONT> where n is a number between 1 and 7
CHANGING THE FONT To change the color, use <FONT COLOR=“red”>….
</FONT>; The color can also be defined using hexadecimal
representation ( Example: #ffffff ) These attributes can be combined to
change the font, size, and color of the
text all at once; For example, <FONT
SIZE=4 FACE=“Courier” COLOR=“red”>
…. </FONT>
<!DOCTYPE html>
<html>
<body>
<p style="color:red;">I am red</p>
<p style="color:blue;">I am blue</p>
<p style="font-size:50px;">I am big</p>
</html>
<!DOCTYPE html>
<html>
<body>
heading</h1>
<p style="background-color:tomato;">This is a
paragraph.</p>
</html>CHANGE BACKGROUND COLOUR
HEADINGS Any document starts with a heading. You can use
different sizes for your headings. HTML also has six levels of
headings, which use the elements <h1>, <h2>, <h3>, <h4>,
<h5>, and <h6>. While displaying any heading, browser
adds one line before and one line after that heading.
<!DOCTYPE html>
<html>
<head>
<title>Heading Example</title>
</head>
<body>
<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
<h4>This is heading 4</h4>
<h5>This is heading 5</h5>
<h6>This is heading 6</h6>
</body>
</html>
ALIGNING TEXT The ALIGN attribute can be inserted in the <P>
and <Hn> tags to right justify, center, or left justify
the text
For example, <H1 ALIGN=CENTER> The New York
Times </H1> would create a centered heading
of the largest size
COMMENT STATEMENTS Comment statements are notes in the HTML code that
explain the important features of the code
The comments do not appear on the Web page itself but
are a useful reference to the author of the page and other
programmers
To create a comment statement use the <!-- …. --> tags
THE INFAMOUS BLINK TAG It is possible to make text blink using the <BLINK> … </BLINK>
tag
However, it is best to use this feature at most sparingly or not
at all; What seems like a good idea to a Web designer can
become very annoying to a Web user
The <BLINK> tag is not supported by Internet Explorer
PAGE FORMATTING To define the background color, use the BGCOLOR
attribute in the <BODY> tag
To define the text color, use the TEXT attribute in the
<BODY> tag
To define the size of the text, type <BASEFONT SIZE=n>
EXAMPLE
<HTML>
<HEAD>
<TITLE> Example </TITLE>
</HEAD>
<BODY BGCOLOR=“black” TEXT=“white”>
<BASEFONT SIZE=7>
This is where you would include the text and images
on your Web page.
</BODY>
</HTML>
<!DOCTYPE html>
<html>
<head>
<style>
body {
background-color: coral;
}
</style>
</head>
<body>
<h1>The background-color Property</h1>
<p>The background color can be specified with a
color name.</p>
</body>
</html>
INSERTING IMAGES Type <IMG SRC = “image.ext”>, where image.ext
indicates the location of the image file
The WIDTH=n and HEIGHT=n attributes can be used to
adjust the size of an image
The attribute BORDER=n can be used to add a border n
pixels thick around the image
ALTERNATE TEXT Some browsers don’t support images. In this case, the ALT
attribute can be used to create text that appears instead
of the image.
Example:
<IMG SRC=“satellite.jpg” ALT = “Picture of satellite”>
LINKS A link lets you move from one page to another, play
movies and sound, send email, download files, and
more….
A link has three parts: a destination, a label, and a target
To create a link type
<A HREF=“page.html”> label </A>
ANATOMY OF A LINK <A HREF=“page.html”> label </A>
In the above link, “page.html” is the destination. The
destination specifies the address of the Web page or file
the user will access when he/she clicks on the link.
The label is the text that will appear underlined or
highlighted on the page
EXAMPLE: LINKS To create a link to CNN, I would type:
<A HREF=“http://www.cnn.com”>CNN</A> To create a link to MIT, I would type:
<A HREF=“http://www.mit.edu”>MIT</A>
CHANGING THE COLOR OF
LINKS The LINK, VLINK, and ALINK attributes can be
inserted in the <BODY> tag to define the color of
a link
LINK defines the color of links that have not been
visited
VLINK defines the color of links that have already
been visited
ALINK defines the color of a link when a user clicks
on it
USING LINKS TO SEND EMAIL To create a link to an email address, type <A
HREF=“mailto:email_address”> Label</A>
For example, to create a link to send email to
myself, I would type: <A HREF=“mailto:
ktdunn@mit.edu”>email Katie Dunn</A>
MARQUEEAn HTML marquee is a scrolling piece of text displayed either
horizontally across or vertically down your webpage depending on
the settings. This is created by using HTML <marquees> tag.<marquee attribute_name = "attribute_value"....more attributes>
One or more lines or text message or image
</marquee>
Sr.No Attribute & Description
1 width
This specifies the width of the marquee. This can be a value like 10 or 20% etc.
2 height
This specifies the height of the marquee. This can be a value like 10 or 20% etc.
3 direction
This specifies the direction in which marquee should scroll. This can be a value like up, down,
left or right.
4 behavior
This specifies the type of scrolling of the marquee. This can have a value like scroll,
slide and alternate.
This specifies how long to delay between each jump. This will have a value like 10 etc.
This specifies the speed of marquee text. This can have a value like 10 etc.
7 loop
This specifies how many times to loop. The default value is INFINITE, which means that the
marquee loops endlessly.
This specifies background color in terms of color name or color hex value.
9 hspace
This specifies horizontal space around the marquee. This can be a value like 10 or 20% etc.
This specifies vertical space around the marquee. This can be a value like 10 or 20% etc.
MARQUEE EXAMPLE
<html>
<head>
<title>HTML marquee Tag</title>
</head>
<marquee>This is basic example of marquee</marquee>
</body>
</html>
<!DOCTYPE html>
<html>
<title>HTML marquee Tag</title>
</head>
<marquee direction = "up">This text will scroll
from bottom to up</marquee>
</body>
META TAG The <meta> tag defines metadata about an HTML document.
Metadata is data (information) about data.
<meta> tags always go inside the <head> element, and are
typically used to specify character set, page description,
keywords, author of the document, and viewport settings.
Metadata will not be displayed on the page, but is machine
parsable.
Metadata is used by browsers (how to display content or reload
page), search engines (keywords), and other web services.
There is a method to let web designers take control over the
viewport (the user's visible area of a web page), through the
<meta> tag (See "Setting The Viewport" example below).
META TAG
<meta charset="UTF-8">
<meta name="description" content="Free Web
tutorials">
<meta name="keywords" content="HTML, CSS,
JavaScript">
<meta name="author" content="John Doe">
<meta name="viewport" content="width=device-
width, initial-scale=1.0">
</head>
ANCHORS
Anchors enable a user to jump to a specific
place on a Web site
Two steps are necessary to create an anchor.
First you must create the anchor itself. Then you
must create a link to the anchor from another
point in the document.
ANCHORS To create the anchor itself, type <A
NAME=“anchor name”>label</A> at the point in
the Web page where you want the user to jump
to
To create the link, type <A HREF=“#anchor
name”>label</A> at the point in the text where
you want the link to appear
EXAMPLE: ANCHOR<A HREF="#chap2">Chapter Two</A><BR>
Link<A NAME="chap2">Chapter 2 </A> Anchor
LIST TAG An unordered HTML list:
• Item
• Item
• Item
• Item
An ordered HTML list:
1. First item
2. Second item
3. Third item
4. Fourth item
ORDERED LISTS Orderedlists are a list
of numbered items.
To create an ordered
Here’s how it would list, type:
look on the Web: <ol>
<li> This is step one.
<li> This is step two.
<li> This is step three.
</ol>
MORE ORDERED LISTS…. The TYPE=x attribute allows you to change the
the kind of symbol that appears in the list.
A is for capital letters
a is for lowercase letters
I is for capital roman numerals
i is for lowercase roman numerals
UNORDERED LISTS An unordered list is a
list of bulleted items
To create an
Here’s how it would unordered list, type:
look on the Web: <ul>
<li> First item in list
<li> Second item in list
<li> Third item in list
</ul>
MORE UNORDERED LISTS...
The TYPE=shape attribute allows you to change
the type of bullet that appears
circle corresponds to an empty round bullet
square corresponds to a square bullet
disc corresponds to a solid round bullet; this is the
default value
HTML DESCRIPTION LISTS
HTML ALSO SUPPORTS DESCRIPTION LISTS.A DESCRIPTION LIST IS A LIST OF TERMS, WITH A DESCRIPTION OF EACH TERM.
<dt>Coffee</dt>
<dd>- black hot drink</dd>
<dt>Milk</dt>
<dd>- white cold drink</dd>
</dl>
LIST
<ul> Defines an unordered list
<ol> Defines an ordered list
<li> Defines a list item
<dl> Defines a description list
<dt> Defines a term in a description list
<dd> Describes the term in a description list
FRAMES
HTML frames are used to divide your browser window into multiple
sections where each section can load a separate HTML document.
A collection of frames in the browser window is known as a
frameset.
The window is divided into frames in a similar way the tables are
organized: into rows and columns.
<!DOCTYPE html>
<html>
<head>
<title>HTML Frames</title>
</head>
<frameset rows = "10%,80%,10%">
<frame name = "top" src = "/html/top_frame.htm" />
<frame name = "main" src = "/html/main_frame.htm" />
<frame name = "bottom" src = "/html/bottom_frame.htm" />
<noframes><body>Your browser does not support
frames.</body>
</noframes>
</frameset>
</html>
<!DOCTYPE html>
<html>
<title>HTML Frames</title>
</head>
<frameset cols = "25%,50%,25%">
<frame name = "left" src = "/html/top_frame.htm" />
<frame name = "center" src = "/html/main_frame.htm" />
<frame name = "right" src = "/html/bottom_frame.htm" />
<noframes>
<body>Your browser does not support frames.</body>
</noframes>
</frameset>
</html>
Sr.No Attribute & Description
cols
Specifies how many columns are contained in the frameset and the size of each column. You
can specify the width of each column in one of the four ways −
Absolute values in pixels. For example, to create three vertical frames, use cols = "100, 500, 100".
A percentage of the browser window. For example, to create three vertical frames, use cols =
"10%, 80%, 10%".
1
Using a wildcard symbol. For example, to create three vertical frames, use cols = "10%, *, 10%".
In this case wildcard takes remainder of the window.
As relative widths of the browser window. For example, to create three vertical frames, use cols
= "3*, 2*, 1*". This is an alternative to percentages. You can use relative widths of the browser
window. Here the window is divided into sixths: the first column takes up half of the window, the
second takes one third, and the third takes one sixth.
rows
This attribute works just like the cols attribute and takes the same values, but it is used to specify
2
the rows in the frameset. For example, to create two horizontal frames, use rows = "10%, 90%".
You can specify the height of each row in the same way as explained above for columns.
border
3 This attribute specifies the width of the border of each frame in pixels. For example, border = "5".
A value of zero means no border.
frameborder
This attribute specifies whether a three-dimensional border should be displayed between
4
frames. This attribute takes value either 1 (yes) or 0 (no). For example frameborder = "0" specifies
no border.
framespacing
This attribute specifies the amount of space between frames in a frameset. This can take any
5
integer value. For example framespacing = "10" means there should be 10 pixels spacing
between each frames.
Sr.No Attribute & Description
src
This attribute is used to give the file name that should be loaded in the frame. Its
1
value can be any URL. For example, src = "/html/top_frame.htm" will load an
HTML file available in html directory.
name
This attribute allows you to give a name to a frame. It is used to indicate which
frame a document should be loaded into. This is especially important when you
2
want to create links in one frame that load pages into an another frame, in
which case the second frame needs a name to identify itself as the target of
the link.
frameborder
This attribute specifies whether or not the borders of that frame are shown; it
3
overrides the value given in the frameborder attribute on the <frameset> tag if
one is given, and this can take values either 1 (yes) or 0 (no).
marginwidth
This attribute allows you to specify the width of the space between the left and
4
right of the frame's borders and the frame's content. The value is given in pixels.
For example marginwidth = "10".
marginheight
This attribute allows you to specify the height of the space between the top
5
and bottom of the frame's borders and its contents. The value is given in pixels.
For example marginheight = "10".
FORMS▪ What are forms?
• An HTML form is an area of the document that allows users to
enter information into fields.
• A form may be used to collect personal information, opinions
in polls, user preferences and other kinds of information.
There are two basic components of a Web form:
the shell, the part that the user fills out, and the
script which processes the information
HTML tags are used to create the form shell. Using
HTML you can create text boxes, radio buttons,
checkboxes, drop-down menus, and more...
Text Box
Radio Buttons
Checkboxes
EXAMPLE: FORM
Submit Button
A form shell has three important parts:
the <FORM> tag, which includes the address of
the script which will process the form
the form elements, like text boxes and radio
buttons
the submit button which triggers the script to send
the entered information to the serverTHE FORM SHELL
To create a form shell, type <FORM
METHOD=POST ACTION=“script_url”> where
“script_url” is the address of the script
Create the form elements
End with a closing </FORM> tagCREATING THE SHELL
To create a text box, type <INPUT TYPE=“text”
NAME=“name” VALUE=“value” SIZE=n
MAXLENGTH=n>
The NAME, VALUE, SIZE, and MAXLENGTH
attributes are optionalCREATING TEXT BOXES
TEXT BOX ATTRIBUTES The NAME attribute is used to identify the text box to the
processing script
The VALUE attribute is used to specify the text that will
initially appear in the text box
The SIZE attribute is used to define the size of the box in
characters
The MAXLENGTH attribute is used to define the maximum
number of characters that can be typed in the box
First Name: <INPUT TYPE="text"
NAME="FirstName"
VALUE="First Name" SIZE=20>
<BR><BR> Here’show it would Last Name: <INPUT
look on the Web: TYPE="text"
NAME="LastName"
VALUE="Last Name" SIZE=20>
<BR><BR>EXAMPLE: TEXT BOX
To create larger text areas, type <TEXTAREA
NAME=“name” ROWS=n1 COLS=n2 WRAP>
Default Text </TEXTAREA>, where n1 is the height
of the text box in rows and n2 is the width of the
text box in characters
The WRAP attribute causes the cursor to move
automatically to the next line as the user typesCREATING LARGER TEXT AREAS
<B>Comments?</B>
<BR>
<TEXTAREA NAME="Comments"
ROWS=10 COLS=50 WRAP>
</TEXTAREA>EXAMPLE: TEXT AREA
To create a radio button, type <INPUT
TYPE=“radio” NAME=“name”
VALUE=“data”>Label, where “data” is the text
that will be sent to the server if the button is
checked and “Label” is the text that identifies
the button to the userCREATING RADIO BUTTONS
<B> Size: </B>
<INPUT TYPE="radio" NAME="Size"
VALUE="Large">Large
<INPUT TYPE="radio" NAME="Size"
VALUE="Medium">Medium
<INPUT TYPE="radio" NAME="Size"
VALUE="Small">SmallEXAMPLE: RADIO BUTTONS
To create a checkbox, type <INPUT
TYPE=“checkbox” NAME=“name”
VALUE=“value”>Label
If you give a group of radio buttons or
checkboxes the same name, the user will only be
able to select one button or box at a time
<B> Color: </B>
<INPUT TYPE="checkbox"
NAME="Color" VALUE="Red">Red
<INPUT TYPE="checkbox"
NAME="Color"
VALUE="Navy">Navy
<INPUT TYPE="checkbox"
NAME="Color"
VALUE="Black">Black
To create a drop-down menu, type <SELECT
NAME=“name” SIZE=n MULTIPLE>
Then type <OPTION VALUE= “value”>Label
In this case the SIZE attribute specifies the height
of the menu in lines and MULTIPLE allows users to
select more than one menu optionCREATING DROP-DOWN MENUS
<B>WHICH IS FAVOURITE FRUIT:</B>
<SELECT>
<OPTION VALUE="MANGOES">MANGOES
<OPTION VALUE="PAPAYA">PAPAYA
<OPTION VALUE="GUAVA">GUAVA
<OPTION VALUE="BANANA"> BANANA
<OPTION VALUE="PINEAPPLE">PINEAPPLE
</SELECT>EXAMPLE: DROP-DOWN MENU
To create a submit button, type <INPUT
TYPE=“submit”>
If you would like the button to say something
other than submit, use the VALUE attribute
For example, <INPUT TYPE=“submit” VALUE=“Buy
Now!”> would create a button that says “Buy
Now!”CREATING A SUBMIT BUTTON
To create a reset button, type <INPUT
TYPE=“reset”>
The VALUE attribute can be used in the same
way to change the text that appears on the
buttonCREATING A RESET BUTTON
Tables can be used to display rows and columns
of data, create multi-column text, captions for
images, and sidebars
The <TABLE> tag is used to create a table; the
<TR> tag defines the beginning of a row while
the <TD> tag defines the beginning of a cell
The BORDER=n attribute allows you to add a
border n pixels thick around the table
To make a solid border color, use the
BORDERCOLOR=“color” attribute
To make a shaded colored border, use
BODERCOLORDARK=“color” and
BORDERCOLORLIGHT=“color”
<TABLE BORDER=10>
<TR>
<TD>One</TD>
<TD>Two</TD>
Here’show it would </TR>
look on the Web: <TR>
<TD>Three</TD>
<TD>Four</TD>
</TR>
</TABLE>CREATING SIMPLE TABLE
<!DOCTYPE html>
<html>
<td>Ernst Handel</td>
<head>
<td>Roland Mendel</td>
</head>
</tr>
<body>
<tr>
<h2>HTML Table</h2>
<td>Helen Bennett</td>
<table>
</tr>
<tr>
<tr>
<th>Company</th>
<td>Laughing Bacchus Winecellars</td>
<th>Contact</th>
<td>Yoshi Tannamuri</td>
<th>Country</th>
<td>Canada</td>
</tr>
</tr>
<tr> <tr>
<td>Alfreds Futterkiste</td> <td>Magazzini Alimentari Riuniti</td>
<td>Maria Anders</td> <td>Giovanni Rovelli</td>
<td>Germany</td> <td>Italy</td>
</tr> </tr>
<tr> </table>
<td>Centro comercial Moctezuma</td>
<td>Francisco Chang</td> </body>
<tr>
When a Web browser displays a table, it often
adds extra space. To eliminate this space use the
WIDTH =n attribute in the <TABLE> and <TD> tags
Keep in mind - a cell cannot be smaller than its
contents, and if you make a table wider than the
browser window, users will not be able to see
parts of it.ADJUSTING THE WIDTH
There are two ways to center a table
Type <TABLE ALIGN=CENTER>
Enclose the <TABLE> tags in opening and closing
<CENTER> tags
Itis possible to wrap text around a table.
This technique is often used to keep
images and captions together within an
article.
To wrap text around a table, type <TABLE
ALIGN = LEFT> to align the table to the
left while the text flows to the right.
Create the table using the <TR>, <TD>,
and </TABLE> tags as you normally
wouldWRAPPING TEXT AROUND A
TABLE
To add space around a table, use the HSPACE=n
and VSPACE=n attributes in the <TABLE> tag
Example:
<TABLE HSPACE=20 VSPACE=20>ADDING SPACE AROUND A
TABLE
It is often necessary to span one cell across many
columns. For example, you would use this
technique to span a headline across the
columns of a newspaper article.
To span a cell across many columns, type <TD
COLSPAN=n>, where n is the number of columns
to be spannedSPANNING CELLS ACROSS
COLUMNS
To span a cell across many rows, type <TD
ROWSPAN=n>, where n is the number of rowsSPANNING CELLS ACROSS
ROWS
By default, a cell’s content are aligned
horizontally to the left and and vertically in the
middle.
Use VALIGN=direction to change the vertical
alignment, where “direction” is top, middle,
bottom, or baseline
Use ALIGN=direction to change the horizontal
alignment where “direction” is left, center, or
rightALIGNING CELL CONTENT
Cell spacing is the space between cells while cell
padding is the space around the contents of a
cell
To control both types of spacing, use the
CELLSPACING =n and CELLPADDING=n attributes
in the <TABLE> tagCONTROLLING CELL SPACING
Create the inner table
Create the outer table and determine which
cell of the outer table will hold the inner
table
Test both tables separately to make sure
they work
Copy the inner table into the cell of the
outer table
Don’t nest too many tables. If you find
yourself doing that, find an easier way to lay
out your Web page
To change a cell’s color, add the
BGCOLOR=“color” attribute to the <TD> tag
Example:
<TD BGCOLOR=“blue”>CHANGING A CELL’S COLOR
You can divide your table into two kinds of
column groups: structural and non-structural.
Structural column groups control where dividing
lines are drawn; Non-structural groups do not
Both let you format an entire column of cells at
onceDIVIDING YOUR TABLE INTO
COLUMN GROUPS
To create structural column
groups, type <COLGROUP
SPAN=n> after the <TABLE> tag,
where n is the number of columns
in the group
To create non-structural column
groups, type <COL SPAN=n>,
where n is the number of columns
in the group
You can also create a horizontal section
consisting of one or more rows. This allows you to
format the rows all at once
To create a horizontal section, type <THEAD>,
<TBODY>, or <TFOOT> before the first <TR> tag of
the section
Netscape does not support these tagsDIVIDING TABLE INTO
HORIZONTAL SECTIONS
Unless you specify otherwise a browser will divide
the lines in a cell as it sees fit.
The NOWRAP attribute placed within the <TD>
tag forces the browser to keep all the text in a
cell on one line
Example:
<TD NOWRAP>Washington, D.C.CONTROLLING LINE BREAKS
THANK YOU….You might also like