HTML table tag

Ankit Virparia — Tue, 14 May 2013 05:56:02 +0000

What is a table?

Table is a structure which is used to store two dimensional information (eg. Excel)
It is a combination of rows and columns.

Characteristics of tabular data

Width of all columns will be same.
Height of all rows will be same.
Number of columns in each row should be same.
When we store any tabular information, generally the first row represents name of the column.

HTML table tag

For creating a table in html mainly four tags are used. The tags are as follows:

– used to define the structure of the table

– used to define a row of the table.

– used to define the header of the table.

– used to define individual cells of the table.

Suppose we want to create a table of size 2×2 i.e. to create a table having 2 rows and two columns.



Welcome




 1 
 2 


 3 
 4

Output:

1	2
3	4

Note: When we create a table, by default it will have following characteristics:

no border
aligned left
occupy width and height which is required to accommodate the text.

If we want to set these values, we need to use three attributes of

tag.



Welcome

1	2
3	4

Output:

1	2
3	4

Merging of cells
- Many times it is required to merge columns or merge rows together. To achieve this we have to attributes : rowspan and colspan.
- Rowspan : this attribute is used to merge rows together into one row. If we want to merge three rows then we need to assign the value 3 to this attribute.
- Colspan : this attribute is used to merge columns together. If we want to merge two columns then we need to assign the value 2 to this attribute.

Examples:

Table – 1

Output:

1
2	3

Table – 2

Output:

1	2
3

Table – 3

Output:

1	2
3

Table – 4

Output:

1	2
	3

Creating table for storing records

Generally when we store any data in a table, each cell of first row describes the name of that particular column. That data is considered to be table header and the tag used for it is tag.

Characteristics of tag.
Text written inside tag is by default aligned to center.
Text is displayed in bold letters.

Sample program:



 ID 
 NAME 
 CONTACT 
 EMAIL 


 1 
 Ankit Virparia 
 9925720005 
 ankit@ankit.co 


 2 
 Sonali Virparia 
 9925720005
 sonali@ankit.co

Output:

ID	NAME	CONTACT	EMAIL
1	Ankit Virparia	9925720005	ankit@ankit.co
2	Sonali Virparia	9925720005	sonali@ankit.co

The post HTML table tag appeared first on Ankit Virparia.

Ankit Virparia » html tag

HTML table tag

What is a table?

Characteristics of tabular data

HTML table tag

Examples:

Creating table for storing records