Monday

Colorful table in Html/Css Tutorial

Attractive table creation tutorial in Html . Sample code for top rated tables

simple html table:

<table border=1 cellpadding=0 cellspacing=0>
<tr><th>S.no</th><th>Products<th></th></tr>
<tr><td>1</td><td>Item.1<td></tr>
<tr ><td>2</td><td>Item.2<td></tr>
<tr ><td>3</td><td>Item.3<td></tr>
</table>



S.noProducts
1Item.1
2Item.2
3Item.3
                                  tr - table row
                                  th - table heading
                                  td - table data

Colorful table with css:
          Using css ,html tables can be made attractive which give a rich look to your website.

css:
   #tablehome {
    border:1px solid #D9D5BE;
    border-collapse:collapse;
    text-align:center;
   
}
#tablehome td {
      border:1px solid #D9D5BE;
      padding: 2px 0px;
      }    

html:
   <table id="tablehome" >
<tr bgcolor=#8B6914 style="color:white;"><th>S.no</th><th>Products<th></th></tr>
<tr bgcolor=#EED5B7><td>1</td><td>Item.1<td></tr>
<tr bgcolor=#EEB422><td>2</td><td>Item.2<td></tr>
<tr bgcolor=#EED5B7><td>3</td><td>Item.3<td></tr>
<tr bgcolor=#EEB422><td>4</td><td>Item.4<td></tr>
</table>
                           
colorful table html/css

0 comments:

Post a Comment

Don't Forget To Join US Our Community
×
blogger