Download presentation
Presentation is loading. Please wait.
1
TABLES
2
Tables in HTML Arrangement of data in the form of rows and columns similar to a spreadsheet. In order to create a table in a web page, firstly the structure of the table is to be defined using the TABLE tag in HTML. All the table related tags are included between the <TABLE>.. </TABLE> tags. Table rows can be of 2 types: Header row: used to display the headings of the column. The content of header row is centered and bold face. Data row: individual data cells placed in the horizontal plane creates a data row.
3
A table header row is defined using the <TH>..</TH> tag.
When the structure of a table is created <TR> tag is used to add a row in the table. It marks the beginning of the row. The closing tag is optional. A table header row is defined using the <TH>..</TH> tag. A table data row is defined using <TD>..</TD> Attributes of TABLE tag: ALIGN: Horizontal alignment is controlled by the ALIGN attribute. Value: LEFT,RIGHT,CENTER. VALIGN: controls the vertical alignment of the cell contents. Value: TOP, MIDDLE,BOTTOM. WIDTH: Sets the WIDTH to a specific number of pixels or to a %age of the available screen width. If the width is not mentioned then the data cell is adjusted based on the cell data value. HEIGHT: specifies the height of table in pixels or %age
4
BORDER: controls the border to be placed around the table
BGCOLOR: displays the background color of a cell, of a row or of table BORDERCOLOR: displays the border with the color specified. BACKGROUND: display image at the background of the table To include image within a cell: include Image tag within the TD tag. To add caption to table, use caption tag within the table tag such as <table><caption>Heading</caption></table>
5
<tr> <td>shilpa <td>21 </tr> <td> vaishali <td>22 </table> </body> </html> <html> <head><title>TABLES</title></head> <body> <table> <tr> <th>NAME <th>AGE </tr>
6
ALIGN= right <table align=right>
7
Align=center <table align=center>
8
Border=2 <table border=2> and <table border=5>
9
Width <table width=25%> and <table width=50%>
10
<table bgcolor=pink border=2>
<table border=2><tr bgcolor=pink> <table border=2> <tr><th bgcolor=pink>
11
<table background="sunset.jpg" border=2>
<table border=2> <tr><td background="sunset.jpg" >
12
<table border=2 bordercolor=red>
<td ><img width=100 height=100 src=sunset.jpg ></td>
13
Advantages of using tables
Data becomes much easier to read and manage All search engines support tables A table can contain many different types of content like form, images, text.
Similar presentations
