Spanning is one of the main reasons tables are a flexible alternative for arranging elements in your Web page.
Spanning enables you to stretch items across multiple cells; you essentially tear down a cell wall. Whether you need to span rows or columns, you can use the concept of spanning to wrangle your table into almost any arrangement.
Column and row spanning takes careful planning. That planning should occur during the sketching phase (as we describe earlier in this chapter, in the section “Sketching Your Table”).
To span cells, you add one of these attributes to the <td> (cell) element:
Spanning cells can be done only by using (X)HTML attributes; CSS doesn’t provide equivalent functionality.
To span columns, you use the colspan attribute in the <td> element and set the value equal to the number of cells you want to span.
Figure illustrates a cell that spans two columns.
Figure : The cell spans two columns
In this example, the first cell spans the two cells in the next row. You use the colspan attribute set to 2, as shown in the following markup, because the cell spans two columns:<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN”
You use the rowspan attribute with the <td> tag. Figure illustrates a cell that spans two rows. To span rows, you use the rowspan attribute in the <td> element and set the value equal to the number of cells you want to span.
Sketch your table first so you know which cells should span which columns and rows. The example design we use throughout most of this chapter uses the colspan attribute with the first cell. However, the design could have been just as simple if we used a rowspan with the last cell that contains the
navigational items. Either way, the table is efficiently laid out.
Figure : The last cell containing navigational items spans two rows.
The modified table comes from the following markup (note the bold rowspan):<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN”
HTML 4 Related Interview Questions
|XML Interview Questions||HTML 4 Interview Questions|
|HTML Interview Questions||HTML 5 Interview Questions|
|HTML DOM Interview Questions||Java Interview Questions|
|CSS Interview Questions||Java Abstraction Interview Questions|
|Dynamic HTML Interview Questions||XHTML Interview Questions|
Html 4 Tutorial
The Least You Need To Know About Html And The Web
Creating And Viewing A Web Page
Proper Planning Prevents Poor Page Performance
Creating (x)html Document Structure
Text And Lists
Linking To Online Resources
Finding And Using Images
Introducing Cascading Style Sheets
Using Cascading Style Sheets
Getting Creative With Colors And Fonts
Using Tables For Stunning Pages
Scripting Web Pages
Working With Forms
Fun With Client-side Scripts
The About Me Page
The Ebay Auction Page
A Company Site
A Product Catalog
Ten Cool Html Tools
Ten Html Do’s And Don’ts
Ten Ways To Exterminate Web Bugs
All rights reserved © 2018 Wisdom IT Services India Pvt. Ltd
Wisdomjobs.com is one of the best job search sites in India.