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


Labels:

Comments

Post a Comment

Popular posts from this blog

How Functions are Used in Excel Fast and Easy Way 3

What is a Function in Microsoft Excel? Microsoft Excel provides a large number of Functions for processing data in Excel Worksheets easily. Functions are predefined formulas in Excel. These functions are used in different types of calculations on numerical or other data  quickly. How a Function is Used in Microsoft Excel? There are three popular ways to use built-in functions in Microsoft Excel. 1. Type Functions Manually 2. Use Function Library Commands 3. Use Insert Function Dialogue Box Other Microsoft Excel Topics on www.ComputerGap.com  Microsoft Excel Formulas and Functions Fast and Easy Way -1 Using Simple Formulas in Excel With Arithmetic Operators 2 How Functions are Used in Excel Fast and Easy Way 3 Create Bar Chart in Excel Easily by Example Employee Pay sheet Formulas in Microsoft Excel  Students Test Score Grades Result Sheet in Excel Electricity Bill Calculator Formulas in Excel    Microsoft Office Word Pro...
Post a Comment
Read more

Attributes of Table Tag

Border: It is used to specify a border and its thickness for a table. Cellspacing: It is used to specify the distance between adjacent cells in a table. Cellpadding : it is used to specify the distance between a cell and cell contents in a table. Width : It is used to specify width of a table in pixels or as percentage to screen width. Align : It is used to specify the horizontal alignment of a table. Possible horizontal alignment values are "left", "right" or "center". Valign : It is used to set the vertical alignment of a table as "top", "bottom" or "middle". Bgcolor : It sets the background color of a table. You can specify color names or hex values for the color. Example of table with border=1, width=200 and align=center attributes HTML Coding: <table border="1" width="200" align="center"> <tr> <th>Book</th><th>Price($)</th> </tr> ...
Post a Comment
Read more

Explain Different Features of Microsoft Excel

Microsoft Excel is a spreadsheet software developed by Microsoft Corporation of USA. Microsoft Excel is used to input and format data and to apply suitable mathematical and other formulas on the data. Excel can perform large number of calculations on data easily in a table like format. The main file of Microsoft Excel is called an Excel Workbook. By default, each workbook has three Excel Worksheets . A Worksheet is divided into Rows, Columns and cells. Microsoft Excel provides many easy to use features as follows: Important Features Provided by MS Excel different features of Microsoft Excel application software 1.    Auto Fill MS Excel provides easy series generating feature called Auto Fill. With the help of Auto Fill you can fill the adjacent cell range with a series like days of a weak or a number series like 1,2,3,4,...10 or 5,10,15,...50 or 1990, 1991, 1992... or dates etc. 2.    Header and Footers Header and footer feature is u...
Post a Comment
Read more