HTML表格进阶(TABLE ADVANCED)_html

表格的色彩

<——Background Color & Image——->

表元的背景色彩和背景图象
<th bgcolor=#>
<th background=”URL”>

#=rrggbb 16 进制 RGB 数码, 或者是下列预定义色彩名称：
Black, Olive, Teal, Red, Blue, Maroon, Navy, Gray, Lime,
Fuchsia, White, Green, Purple, Silver, Yellow, Aqua

<table border><tr><th bgcolor=ffaa00>Food</th>    <th bgcolor=Red>Drink</th>    <th rowspan=2 background="image.gif">Sweet</th><tr bgcolor=white><td>A</td><td>B</td></table>

<——Border Color——->

表格边框的色彩
<table bordercolor=#>

<table cellspacing=5 border=5 bodercolor=#ffaa00><tr><th>Food</th><th>Drink</th><th>Sweet</th><tr><td>A</td><td>B</td><td>C</td>      </table>

<——Light & Dark Border Color——->

表格边框色彩的亮度控制
<table bordercolorlight=#>
<table bordercolordark=#>

<table cellspacing=5 border=5      bordercolorlight=White bordercolordark=Maroon><tr><th>Food</th><th>Drink</th><th>Sweet</th><tr><td>A</td><td>B</td><td>C</td>      </table>

http://www.gaodaima.com/32292.htmlHTML表格进阶(TABLE ADVANCED)_html

<–################## Structured Table ########################–>

表格的分组显示(Structured Table)

<——Groups of Rows——->

按行分组
<thead> … </thead> – 表的题头(Header)
<tbody> … </tbody> – 表的正文(Body)
<tfoot> … </tfoot> – 表的脚注(Footer)

<table border><thead>     <tr><th>Food</th><th>Drink</th><th>Sweet</th></thead><tbody>     <tr><td>A</td><td>B</td><td>C</td>     <tr><td>D</td><td>E</td><td>F</td></tbody></table>

<——Groups of Columns——->

按列分组
<colgroup align=#> #=left, right, center

<table border width=160><colgroup align=left><colgroup align=center><colgroup align=right>     <thead>          <tr><th>Food</th><th>Drink</th><th>Sweet</th>     </thead>     <tbody>          <tr><td>A</td><td>B</td><td>C</td>          <tr><td>D</td><td>E</td><td>F</td>     </tbody></table>

<——Groups of Columns——->

列的属性控制
<col span=#> #=从左数起，具有指定属性的列的列数
<col align=#> #=left, right, center

<table border width=160><colgroup>     <col align=center span=2><colgroup align=right>     <thead>          <tr><th>Food</th><th>Drink</th><th>Sweet</th>     </thead>     <tbody>          <tr><td>A</td><td>B</td><td>C</td>          <tr><td>D</td><td>E</td><td>F</td>     </tbody></table>

<–################## Frame ########################–>

表格中边框的显示

<——all——->

显示所有 4 个边框 <table frame=box>

<table border frame=box><thead>     <tr><th>Food</th><th>Drink</th><th>Sweet</th></thead><tbody>     <tr><td>A</td><td>B</td><td>C</td>     <tr><td>D</td><td>E</td><td>F</td></tbody></table>

<——above——->

只显示上边框 <table frame=above>

<——below——->

只显示下边框 <table frame=below>

<——hsides——->

只显示上、下边框 <table frame=hsides>

<——vsides——->

只显示左、右边框 <table frame=vsides>

<——lhs——->

只显示左边框 <table frame=lhs>

<——rhs——->

只显示右边框 <table frame=rhs>

<——void——->

不显示任何边框 <table frame=void>

<–################## Rule ########################–>

表格中分隔线(Rules)的显示

<——all——->

显示所有分隔线 <table rules=all>

<table border rules=all><colgroup><col align=center span=2><colgroup align=right>     <thead>          <tr><th>Food</th><th>Drink</th><th>Sweet</th>     </thead>     <tbody>          <tr><td>A</td><td>B</td><td>C</td>          <tr><td>D</td><td>E</td><td>F</td>     </tbody>     <tbody>          <tr><td rowspan=3 align=right>Total $-00.0</td>     </tbody></table>

<——groups——->

只显示组(Groups)与组之间的分隔线 <table rules=groups>

<——rows——->

只显示行与行之间的分隔线 <table rules=rows>

<——cols——->

只显示列与列之间的分隔线 <table rules=cols>

<——none——->

不显示任何分隔线 <table rules=none>

欢迎大家阅读《HTML表格进阶(TABLE ADVANCED)_html》,跪求各位点评,若觉得好的话请收藏本文，by 搞代码

喜欢 (0)赏

[搞代码]

分享 (0)