• Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint
Share this Page URL
Help

Lesson 14. Styling a Data Table > Starting with a Basic Table

Starting with a Basic Table

As CSS increases in popularity, there is a growing trend to move away from using tables to mark up content. However, there are times when tables are the best markup option, especially for tabular data. A basic data table is shown in Listing 14.1.

Listing 14.1. HTML Code Containing the Markup for a Data Table

<table>
    <tr>
        <td>Item</td>
        <td>Threaded screws </td>
        <td>Flat nails</td>
        <td>Dyna-bolts </td>
        <td>Spring washers</td>
    </tr>
    <tr>
        <td>1 kg</td>
        <td>$2.50</td>
        <td>$3.50</td>
        <td>$4.50</td>
        <td>$2.50</td>
    </tr>
    <tr>
        <td>2kg</td>
        <td>$3.00</td>
        <td>$4.00</td>
        <td>$5.00</td>
        <td>$3.00</td>
    </tr>
    <tr>
        <td>3kg</td>
        <td>$3.50</td>
        <td>$4.50</td>
        <td>$5.50</td>
        <td>$3.50</td>
    </tr>
    <tr>
        <td>4kg</td>
        <td>$4.00</td>
        <td>$5.00</td>
        <td>$6.00</td>
        <td>$4.00</td>
    </tr>
</table>


					  


PREVIEW

                                                                          

Not a subscriber?

Start A Free Trial


  
  • Creative Edge
  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint