废话不多说了 , : :
<! Doctype html> <html> <éad- head> <meta charset = utf-8> <tapie> 表格 </ title> <style type = text / css> * {margin: 0; rembourrage: 0; } corps {Font: italique 20px Géorgie, serif; Espacement des lettres: normal; Color d'arrière-plan: # F0F0F0; } #Content {width: 750px; rembourrage: 40px; marge: 0 auto; Color d'arrière-plan: #FFF; Border-Left: 30px solide # 1d81b6; Border-droite: 1px solide #ddd; Box-Shadow: 0px 0px 16px #AAA; } # Table1 {Font: Bold 16px / 1.4em Trebuchet MS, Sans-Serif; } # TABLE1 THE TH TH {Padding: 15px; Border: 1px solide # 93CE37; Border-Bottom: 3px solide # 9ed929; Text-shadow: 1px 1px 1px # 568F23; Couleur: #FFF; Color d'arrière-plan: # 9DD929; Border-Radius: 5px 5px 0px 0px; } # TABLE1 thead th: vide {background-Color: transparent; Border: aucun; } # Table1 tbody th {padding: 0px 10px; Border: 1px solide # 93CE37; Border-Dight: 3px solide # 9ed929; Text-shadow: 1px 1px 1px # 568F23; Couleur: # 666; Color d'arrière-plan: # 9DD929; Border-Radius: 5px 0px 0px 5px; } # Table1 tbody td {padding: 10px; Border: 2px solide # e7EFE0; Texte-aligne: Centre; Text-shadow: 1px 1px 1px #fff; Couleur: # 666; Color d'arrière-plan: # DEF3CA; Border-Radius: 2px; } # Table1 tbody span.check :: avant {contenu: url (images / check0.png); } # Table1 TFOOT TD {Padding: 10px 0px; taille de police: 32px; Couleur: # 9CD009; Texte-aligne: Centre; Text-shadow: 1px 1px 1px # 444; } </ style> </ head> <body> <div id = contenu> <table id = table1> <thead> <tr> <th> </th> <th scope = colb = starter> starter intelligent </ th> <th Scope = Col abbr = Medium> Smart Medium </th> <th Scope = Col ABBR = Business> Smart Business </th> <Th Scope = Col ABBR = Deluxe> Smart Deluxe </th> </ Trans > </ thead> <tfoot> <tr> <th Scope = Row> Prix par mois </th> <Td> 2,90 $ </td> <td> 5,90 $ </td> <td> 9,90 $ </td > <td> 14,90 $ </td> </tr> </tfoot> <tbody> <tr> <th Scope = Row> Espace de stockage </th> <TD> 512MB </TD> <TD> 1 Go < / td> <td> 2 gb </td> <td> 4 gb </td> </tr> <tr> <th Scope = Row> Bandwidth </th> <td> 50 gb </td> <td > 100 Go </td> <td> 150 Go </td> <td> Unlimited </td> </tr> <tr> <th Scope = ROW> MySQL Bases de données </th> <TD> Unlimited </ td > <td> illimited </td> <td> illimited </td> <td> illimited </td> </tr> <tr> <th scope = row> Configuration </th> <td> 12.90 ___ fckpd ___ 0lt; / td> <td> 12.90 ___ fckpd ___ 0lt; / td> <td> gratuit </td> <td> gratuit </td> </tr> <tr> <th Scope = row> php 5 </th> <td> < span class = check> </ span> </td> <td> <span class = check> </span> </td> <td> <span class = check> </span> </td> <td> <span class = check> </span> </td> </tr> <tr> <th Scope = Row> Ruby on rails </th> <td> <span class = check> </span> </td > <td> <span class = check> </ span> </td> <td> <span class = check> </span> </td> <td> <span class = check> </span> </ td> </tr> </ tbody> </ table> </div> </ body> </html>好了 , 代码到此介绍 , 完美表格效果就制作出来了。