HTML 

Tables in HTML

0
Tables in HTML

Tables is the most important Concept in the HTML, Some websites will use the table concept to align or to place the images or any other text boxes in the correct places. 
A normal HTML Tags cant be used to align the boxes in correct alignment , so to that we can use the table for data entry as well as alignment.


Syntax : 

Code:
<table>.... </table>


Attributes used in Tables : 

Code:
1. <table rules="rows / cols / all"> ("rows" include Lines between rows and "cols" include Lines between columns and "all" include lines in both rows and columns)

2. <table border="value"> (1 is the Default value and 0 is for invisible lines)

3. <table width="value">

4. <table height="value">

5. <table bgcolor="value"> (you can change the color of the table by this syntax)

6. <table background="src of the image">

7. <table frame="value"> ( value = void / above / below / box / hsides / vsides / lhs / rhs / border)


Elements Used in Table :

  • <tr> ..</tr> - to create rows. (tr - table rows)
  • <td>.. </td> - to create table data (td - Table Data)
  • <th>.. </th> - to create Table header (th - Table Header)
Simple Example to create Tables : 

Code:
<html>
<head>
<title>Example on Tables</title>
</head>
<body>
<table border="1">
<tr>
  <th>Table Header1</th>
  <th>Table Header2</th>
</tr>
<tr>
  <td>row 1, cell 1</td>
  <td>row 1, cell 2</td>
</tr>
<tr>
  <td>row 2, cell 1</td>
  <td>row 2, cell 2</td>
</tr>
</table>
</body>
</html>


Here in the above Example , The border Size is 1, which is default and it shows the thin line in between rows and columns. 

if u set the border size=0 , then the line will not be visible .. 


Output : 
   



Try with those attributes present above .


Pls leave the comment if u dont understand the concept.. 

We will see Webpage Designing in Next Thread . !! Smile 
“Work hard in silence, let your success be your noise...”

    Tables in HTML