TABLES in HTML:
Roll
No.
|
Name
|
Class
|
1001
|
Rashmi
|
PGDCA
|
1002
|
Bhavika
|
DCA
|
1003
|
Monika
|
BCA
|
1004
|
Abhilasha
|
MCA
|
1005
|
Kamna
|
B.Sc.
– CS
|
<TABLE>
Tag: We can place our data in web page using
Tables. Tables may contain Table Rows, Table Heading and Table Data. This tag
is used to create a table and contain table items like <TR>, <TH>,
<TD>, etc. Start and end tags both are required and supported by all the
browsers.
Attribute
|
Specification
and Value
|
BORDER
|
It
sets the border width in pixels
|
BORDERCOLOR
|
It
sets color of the border
|
BGCOLOR
|
Back
ground color of the table
|
BACKGROUND
|
It
specifies background image
|
CELLSPACING
|
It
gives the distance between cells
|
CELLPADDING
|
It
sets the spacing between cell wall and cell content
|
HSPACE/VSPACE
|
It
sets the horizontal/vertical padding (space) for the entire table
|
HEIGHT/WIDTH
|
We
can set cell height/Width in pixels for entire table
|
ALIGN
|
LEFT, CENTER, RIGHT
|
STYLE
|
Inline
styling is used to apply a unique style (or formatting) to a single HTML
element.
|
TITLE
|
Title
of the tag (like “ToolTipText” in VB)
|
<TR>
Tag: It creates a row in a table and
contains <TH> and <TD>. Start and end tags both are required.
Attribute
|
Specification
and Value
|
ALIGN
|
LEFT, RIGHT, CENTER (Horizontal Alignment)
|
VALIGN
|
It
sets the vertical alignment of the data in current row.
TOP, MIDDLE, BOTTOM
|
BGCOLOR
|
Only
for current Row
|
BORDERCOLOR
|
Colour
of the border
|
STYLE
|
Inline
styling is used to apply a unique style (or formatting) to a single HTML
element.
|
TITLE
|
Title
of the tag (like “ToolTipText” in VB)
|
<TH>
Tag: It specifies table heading and usually
displayed in BOLD and placed inside the <TR> tag. Start tag is required
and end tag is optional.
Attribute
|
Specification
and Value
|
ROWSPAN
|
It
merges cells of a COLUMN and creates single cell.
|
COLSPAN
|
It
merges cells of a ROW and creates a single cell.
|
ALIGN
|
LEFT,
RIGHT, CENTER (Horizontal Alignment)
|
VALIGN
|
It
sets the vertical alignment of the data in current cell.
TOP,
MIDDLE, BOTTOM
|
BACKGROUND
|
Background
image for current cell
|
BGCOLOR
|
Background
colour for current cell
|
BORDERCOLOR
|
Colour
of the border
|
HEIGHT/WIDTH
|
We
can set cell height/Width in pixels for current cell
|
STYLE
|
Inline
styling is used to apply a unique style (or formatting) to a single HTML
element.
|
TITLE
|
Title
of the tag (like “ToolTipText” in VB)
|
<TD>
Tag: It specifies table data for a table
cell and placed inside the <TR> tag. Start tag is required and end tag is
optional.
Note:
All attributes are same as <TH> tag.
Attribute
|
Specification
and Value
|
ROWSPAN
|
It
merges cells of a COLUMN and creates single cell.
|
COLSPAN
|
It
merges cells of a ROW and creates a single cell.
|
ALIGN
|
LEFT,
RIGHT, CENTER (Horizontal Alignment)
|
VALIGN
|
It
sets the vertical alignment of the data in current cell.
TOP,
MIDDLE, BOTTOM
|
BACKGROUND
|
Background
image for current cell
|
BGCOLOR
|
Background
colour for current cell
|
BORDERCOLOR
|
Colour
of the border
|
HEIGHT/WIDTH
|
We
can set cell height/Width in pixels for current cell
|
STYLE
|
Inline
styling is used to apply a unique style (or formatting) to a single HTML
element.
|
TITLE
|
Title
of the tag (like “ToolTipText” in VB)
|
<CAPTION>
Tag: This tag is used to specify caption (name)
of the table, means we can give a name to a table using this tag and used
inside the <TR> tag. Start and end tags both are required.
~ ~ ~ ~ ~ ~ ~ * ~ ~ ~ ~ ~ ~ ~
Example:
<HTML>
<HEAD><TITLE>Working with Table
in web page </TITLE></HEAD>
<BODY BGCOLOR=“AQUA” TEXT=“PURPLE”>
<CENTER><H1>Student
Information</H1></CENTER>
<TABLE
BORDER=“3” BORDERCOLOR=“BLUE”
CELLPADDING=“30” CELLSPACING=“20”
ALIGN=“CENTER”>
<TR>
<TH>ROLL
NO
<TH>NAME
<TH>CLASS
</TR>
<TR>
<TD>1001
<TD>RASHMI
<TD>B.Sc. – CS
</TR>
<TR>
<TD>1002
<TD>MONIKA
<TD>B.Sc. – IT
</TR>
<TR>
<TD>1003
<TD>ABHILASHA
<TD>B.Sc. – PCM
</TR>
<TR>
<TD>1004
<TD>KAMNA
<TD>B.Sc. – CS
</TR>
<TR>
<TD>1005
<TD>BHAVIKA
<TD>B.Sc. – CS
</TR>
</TABLE>
</BODY>
</HTML>
~ ~ ~ ~ ~ ~ ~ * ~ ~ ~ ~ ~ ~ ~
Thankyou Very much sir,
ReplyDelete