HTML | Tags and Attributes [TABLE] [Spanning]


Ü To span rows and columns, we will use the ROWSSPAN and the COLSPAN attributes respectively. These attributes are used in the <TH> and in the <TD> tags. To understand ROWSPAN consider the following input.

Input :
<HTML><HEAD><TITLE>TABLE</TITLE></HEAD>
<BODY>
Use of rowspan<BR>
<TABLE BORDER=1 WIDTH=50%>
<TR>
<TD ROWSPAN=3>Planets</TD>
<TD>Mercury</TD>
</TR>
<TR>
<TD>Venus</TD>
</TR>
<TR>
<TD>Earth</TD>
</TR>
</TABLE></BODY></HTML>
Output :






In the above input, the Planets and the Mercury are in the same row. But the other 2 rows below Planets were deleted as the value of the ROWSPAN was given 3. Actually, ROWSPAN=3, combines the 3 three rows of the first column.
To understand COLSPAN consider the following input.
Input :
<HTML><HEAD><TITLE>TABLE</TITLE></HEAD>
<BODY>
Use of colspan<BR>
<TABLE BORDER=1 WIDTH=50%>
<TR>
<TD ALIGN=CENTER COLSPAN=2>USA</TD>
</TR>
<TR>
<TD ALIGN=CENTER>New York</TD>
<TD ALIGN=CENTER>New Jersy</TD>
</TR>
</TABLE></BODY></HTML>
Output :






In the above input, the table actually having 2 columns, but in the first row by giving COLSPAN=2, the columns were combined to 1.
In the above input, we also used an attribute ALIGN. We will discuss about it later.

Author: Tanmay Chakrabarty

Tanmay Chakrabarty is a former CSE student, currently working as a Senior Software Engineer with 5+ years of experience in the field of Web Application development in PHP+MySQL platform with strong skills in Javascript, JQuery, JQuery UI and CSS. He tries to write notes every week but fails due to heavy loads of duty.

Recommended Recommends

Comments

Contact Us