Skip to main content

Nested Tables

Table Data and Table Header Attributes
  • Colspan: Specifies how many cell columns of the table this cell should span.
  • Rowspan: Specifies how many cell rows of the table this cell should span.
  • Align: cell data can have left, right, or center alignment.
  • Valign: cell data can have top, middle, or bottom alignment.
  • Width: you can specify the width as an absolute number of pixels or a percentage of the document width.
  • Height: You can specify the height as an absolute number of pixels or a percentage of the document height.
Basic Table Code
<TABLE BORDER=1 width=50%>
<CAPTION>  <h1>Spare Parts <h1> </Caption>
         <TR><TH>Stock Number</TH><TH>Description</TH><TH>List Price</TH></TR>
         <TR><TD bgcolor=red>3476-AB</TD><TD>76mm Socket</TD><TD>45.00</TD></TR>
         <TR><TD >3478-AB</TD><TD><font color=blue>78mm Socket</font> </TD><TD>47.50</TD></TR>
         <TR><TD>3480-AB</TD><TD>80mm Socket</TD><TD>50.00</TD></TR>
</TABLE>
Column and Row Span
Table cells have two important attributes
Column and Row Span – Example

<table cellspacing="0">
    <tr class="1"><td>Cell[1,1]</td>
        <td colspan="2">Cell[2,1]</td></tr>
    <tr class=“2"><td>Cell[1,2]</td>
        <td rowspan="2">Cell[2,2]</td>
        <td>Cell[3,2]</td></tr>
    <tr class=“3"><td>Cell[1,3]</td>
        <td>Cell[2,3]</td></tr>
</table>
What will be the output?
<TABLE BORDER width=“750”>
   <TR> <TD colspan=“4” align=“center”>Page Banner</TD></TR>  
  <TR> <TD rowspan=“2” width=“25%”>Nav Links</TD><TD colspan=“2”>Feature Article</TD> <TD rowspan=“2” width=“25%”>Linked Ads</TD></TR>
                                                                                                               
<TR><TD width=“25%”>News Column 1 </TD> <TD width=“25%”><News Column 2 </TD></TR>
</TABLE>

The Output


Comments

Popular posts from this blog

Introduction of SQL

Introduction of SQL SQL (Structure Query Language)  was initially developed at IBM by Donald D. Chamberlin and Raymond F. Boyce in the early 1970s. This version, initially called SEQUEL (Structured English Query Language), was designed to manipulate and retrieve data stored in IBM's original quasi-relational database management system. Features of SQL SQL is not a case sensitive language. Every commands in SQL should ends with semicolon(;). SQL can also called as sequel (SEQUEL). SQL Sub Language SQL is mainly divided into four sub language Data Definition Language(DDL) Data Manipulation Language(DML) Transaction Control Language(TCL) Data Control Language(DCL) Only for remember You can remember all these command like below; DDL Commands "dr. cat" d-Drop, r-Rename, c-Create, a-Alter, t-Truncate. DML commands "sudi". s-Select, u-Update, d-Delete, i-Insert.

Text Formatting

• Text formatting tags modify the text between the opening tag and the closing tag – Ex. <b>Hello</b> makes “Hello” bold

css introduction

What is CSS? •Stands for Cascading Style Sheet •CSS allows you to style HTML elements, or define how they are displayed. •Styles are normally stored in Style Sheets •External Style Sheetscan save you a lot of work •External Style Sheets are stored in CSS files •Multiple style definitions will cascadeinto one •Examples: –Changing the color of text –Specifying the size and position of a div What is CSS? (cont.) •CSS is an alternative to the “style” attribute. – <div style=“height:500px; width:200px”></div> •Advantages: –Can control the style of many different elements with a single command. –Separation of function: HTML can focus on content while CSS handles styling. CSS (Cascading Style Sheet) •Simple mechanism for adding style to web page •Code be embedded into the HTML file •HTML tag: <style type=“text/css”>CODE</style> •Also be in a separate file FILENAME.css •HTML tag: <link rel=“stylesheet” href=“scs.css” type=“text/css”> •St...