看看表像之下是什麼
這本可以做得簡單得多。 | 猜猜我們在這個小表格裏用了多少代碼?足足 13.7k。這玩意兒一共有 17 行 9 列,還沒算上那些用來做間隔的 GIF! | ||||||||||||
這種方法用了太多的表格單元和間隔符。 | 而且所有這種虛線邊界都是用表格單元的 background 屬性完成的,這可通不過 HTML 標準的驗證。
| ||||||||||||
全部這些其實可以只用 8 個表格單元加 4 條 CSS 規則就搞定的。 | 我是說真的,只要 8 格單元和 4 條規則,只要這些。
| ||||||||||||
這四條規則是:一條給 <table>,一條給 <td>,一條給 <ul>,還有一條給 <li>。 | 就這麼簡單,寫好這些就大功告成了。
| ||||||||||||
下面的代碼描述的表格的結構:
table{ margin:3px; padding:2px; border:solid 2px blue }
td{ padding:2px; border-style: solid; border-width: 1px; border-color:gray gray silver silver }