Scribd
Upload
17 views23 pages

Day 8

My Presentation

Uploaded by

Mehul Rabari
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
17 views23 pages

Day 8

My Presentation

Uploaded by

Mehul Rabari
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 23

L.J.

Institute Of Computer Applications

WDT
HTML Table

Presented by-
Prof. Meetu Joshi
Contents

• HTML5 Table

L.J. Institute Of Computer Applications


HTML Table

• HTML table tag is used to display data in tabular form


(row * column). There can be many columns in a row.

• We can create a table to display data in tabular form,


using <table> element, with the help of <tr> , <td>, and
<th> elements.

• In Each table, table row is defined by <tr> tag, table


header is defined by <th>, and table data is defined by
<td> tags.

L.J. Institute Of Computer Applications


Table Header
• Table Data cells are represented by the TD
element. Cells can also be TH (Table Header)
elements which results in the contents of the
table header cells appearing centered and in
bold text.
HTML Table

L.J. Institute Of Computer Applications


Table

L.J. Institute Of Computer Applications


HTML Table border

L.J. Institute Of Computer Applications


Output

L.J. Institute Of Computer Applications


Tables Attributes
 Width: you can specify the table width as an
absolute number of pixels or a percentage of
the document width. You can set the width
for the table cells as well.
 Border: You can choose a numerical value for
the border width, which specifies the border
in pixels.
 CellSpacing: Cell Spacing represents the
space between cells and is specified in pixels.
Continue..
 CellPadding: Cell Padding is the space
between the cell border and the cell
contents and is specified in pixels.
 Align: tables can have left, right, or center
alignment.
 Background: Background Image, will be
titled in IE3.0 and above.
 BorderColor, BorderColorDark.
Table Caption
 A table caption allows you to specify a line of text
that will appear centered above or bellow the
table.
<TABLE BORDER=1 CELLPADDING=2>
<CAPTION ALIGN=“BOTTOM”> Label For My Table
</CAPTION>

 The Caption element has one attribute ALIGN that


can be either TOP (Above the table) or BOTTOM
(below the table).
Table Data and Table Header Attributes
 Colspan: Specifies how many cell columns of the table this cell should
span.

 Rowspan: Specifies how many cell rows of the table this cell should
span.

 Align: cell data can have left, right, or center alignment.

 Valign: cell data can have top, middle, or bottom alignment.

 Width: you can specify the width as an absolute number of pixels or a


percentage of the document width.

 Height: You can specify the height as an absolute number of pixels or a


percentage of the document height.
Colspan Example

L.J. Institute Of Computer Applications


Output-

L.J. Institute Of Computer Applications


Rowspan Example

L.J. Institute Of Computer Applications


Output-

L.J. Institute Of Computer Applications


Page layout using table

L.J. Institute Of Computer Applications


Output-

L.J. Institute Of Computer Applications


Time table exercise-

L.J. Institute Of Computer Applications


Time table exercise continue…

L.J. Institute Of Computer Applications


Output-

L.J. Institute Of Computer Applications


Assignment

1) Create a table with the use of HTML tags.

L.J. Institute Of Computer Applications


L.J. Institute Of Computer Applications

[email protected]
Copyrights © 2020 L.J.K Trust, All Rights Reserved.

23

You might also like