Skip to main content

HTML Table Tag Basics

Tables

Tables are very important to show data in the form of rows and columns. Tables make data more readable and easy to understand. A table consists of rows, columns and cells.

HTML Tags To Make A Table

As we know that there are basically three elements in a table, that is, rows, columns and cells. So, there are the following basic tags to create a table in an HTML web page:
  1. <TABLE> tag
  2. <TR> tag
  3. <TD> tag
  4. <TH> tag


 

<TABLE> Tag

<Table> tag is used to specify the start of a table. It also specifies some attributes of the table like ALIGN and BORDER attributes etc.
Example 1: <Table>                    => Table without a border.
Example 2: <Table border="1">     => Table with a border of width 1.
Example 3: <Table align="left" border="2">  => A left aligned Table with a border of width 2.

<TR> Tag

TR stands for TABLE ROW. As the name shows, <TR> tag is used to create a row in a table. A row is started by <TR> tag and is closed by </TR> tag. There are one or more <TD> or <TH> tags between <TR> and </TR> tags to create cells.

Example 1: <TR>
                <TD>1</TD>
                <TD>Ahmad</TD>
                </TR>
Output:

1 Ahmad

Example 2:
              <TR bgcolor="red">
              <TD>1</TD>
                <TD>Ahmad</TD>
               </TR>
Output
1 Ahmad


 

<TD> Tag

<TD> tag is used to create a cell. TD stands for TABLE DATA. In addition, the number of cells in a row will specify number of columns in a table. The data to be shown in a cell is placed between <TD> and </TD> tags.

Example 1: <TD>Ahmad</TD>
Example 2: <TD bgcolor="yellow">345</TD>
Example 3: <TD width="100">Nasir</TD>

<TH> Tag

<TH> tag is used to create a header row in a table. TH stands for TABLE HEADING.One <TH> tag makes one header cell. The data to be shown in header cell is placed between <TH> and </TH> tags.


Example 1: <TH> Roll No </TH>
Example 2: <TH bgcolor="yellow">Name</TH>
Example 3:
<TR>
<TH>Roll Number</TH>
<TH>Name</TH>
<Th Marks</TH>
</TR>
Output:

Roll Number Name Marks

A Complete Table Example Code and Output in Browser

HTML sample CodeOutput in web browser
<table border="4">
<tr>
<th>Roll Number</th>
<th>Name</th>
<th>Marks</th>
</tr>
<tr>
<td>1</td>
<td>Ahmad</td>
<td>700</td>
</tr>
</table>

Roll Number Name Marks
1 Ahmad 700


Comments

Popular posts from this blog

Bus Topology Advantages Disadvantages

Bus Topology Bus topology is the simplest network topology . In bus topology , all computers in network are connected to a common communication wire. This wire is called BUS. Terminators are used at both ends of wire. Bus Topology is Cheap, easy to handle and implement. Bus Topology require less cable. Bus Topology is best suited for small networks. Working of Bus Topology with Advantages and Disadvantages Advantages of Bus Network Topology 1. It is very simple topology . 2. It is easy to use. 3. It needs small amount of wire for connecting computers. 4. It is less expensive due to small wire needed. 5. If one computer fails, it does not disturb the other computers in network. Other computers will continue to share information and other resources with other connected computers. Disadvantages of Bus Network Topology 1. Only small number of computers can be connected in a bus network . 2. Network speed slows down as the number of computer increases in b...

Explain Different Types Of Data

DATA Data is the collection of raw facts and figures. It is without any proper meaning. Data may be collection of words, numbers, graphics or sounds. What is data? Explain different types of data Examples of Data 1) Student Data on Admission Forms When students get admission in a college. They fill admission form. This form     contains raw facts (data of student) like name, father’s name, address of student etc. 2)    Data of Citizens During census, data of all citizens is collected. 3)    Survey Data Different companies collect data by survey to know the opinion of people about their product. 4)    Students Examination data In examination data about obtained marks of different subjects for all students is collected.    Different Types Of Data There are following main types of Data. 1)    NUMERIC DATA Numeric data consists of 0 to 9 digits, + and – sign and dec...

Explain Main Difference Between System Software and Application Software

Topic: Explain Main Difference Between System Software and Application Software            Differentiate between system software and application software Before , explaining the main differences between application software and system software, let us know the definitions of Application software and System software with examples. What is System Software: System software is a set of programs to control all components of computer and to manage overall operations of computer system. Differences between System software and application software System software is used as a base to install and run all application software. Examples of system software include: Operating Systems, like Microsoft Windows, DOS, Unix and Linux Device Drivers like Device driver software of a Printer (found on CD normally provided with the printer) Utility Programs like AVAST anti virus, Disk Scanners and File Viewers etc. What is Applicat...