div+css再牛*也無(wú)法完全取代table,很多時(shí)候還是需要用到表格,這里就不探討孰優(yōu)孰劣,什么時(shí)候要用表格什么時(shí)候用div了。隨便搜下,幾十萬(wàn)條。貼出dl dt dd模擬表格實(shí)例,不推薦在實(shí)際項(xiàng)目中使用,可以了解dl dt dd的用法。測(cè)試瀏覽器:ie6/ie7/ie8/ff3.0
css:
dl,dt,dd{
margin:0;
background:#fff5fa;
font-size:14px;
}
dl{
margin:0 auto;
width:50%;
border:1px solid #f8b3d0;
border-bottom:none;
}
dt{
font-weight:800;
background:#ff99cc;
color:#fff;
}
dt,dd{
line-height:30px;
padding:0 0 0 10px;
border-bottom:1px solid #f8b3d0;
height:30px;
overflow:hidden
}
dd{
text-indent:3em;
}
.fff{
background:#fff
}
dt span,dd span{
display:block;
float:right;
font-size:14px;
border-left:1px solid #f8b3d0;
text-indent:0em;
width:80px;
text-align:center;
}
xhtml:
<dl class=hb>
<dt><span>下載地址</span><span>更新時(shí)間</span>ks5u生物同步課課練(人教版必修一)</dt>
<dd class=fff><span>——</span><span>11.2</span>第一節(jié) 從生物圈到細(xì)胞生物圈到細(xì)生物圈到細(xì)生物圈到細(xì)生物圈到細(xì)生物圈到細(xì)生物圈到細(xì)生物圈到細(xì)</dd>
<dd><span>——</span><span>11.3</span>第二節(jié) 細(xì)胞的多樣性和統(tǒng)一性</dd>
<dd class=fff><span>——</span><span>11.4</span>單元測(cè)評(píng)</dd>
<dd><span>——</span><span>11.5</span>歐美代議制的確立與發(fā)展</dd>
<dd class=fff><span>——</span><span>11.6</span>中國(guó)古代文化史</dd>
<dd><span>——</span><span>11.7</span>近代中國(guó)的政治、經(jīng)濟(jì)及思想解放的潮流</dd>
<dd class=fff><span>——</span><span>11.9</span>近代中國(guó)政治發(fā)展史</dd>
<dd><span>——</span><span>11.10</span>近代中國(guó)經(jīng)濟(jì)發(fā)展史</dd>
<dd class=fff><span>——</span><span>11.11</span>近代中國(guó)思想解放潮流</dd>
<dd><span>——</span><span>11.12</span>現(xiàn)代西方的政治、經(jīng)濟(jì)與科技文化</dd>
<dd class=fff><span>——</span><span>11.13</span>羅斯福新政與二戰(zhàn)后的世界經(jīng)濟(jì)</dd>
<dd><span>——</span><span>11.14</span>二戰(zhàn)后世界政治格局的演變</dd>
<dd class=fff><span>——</span><span>11.16</span>19世紀(jì)以來(lái)的世界文學(xué)藝術(shù)與科技</dd>
<dd><span>——</span><span>11.17</span>現(xiàn)代中國(guó)的政治、經(jīng)濟(jì)及思想文化</dd>
<dd class=fff><span>——</span><span>11.18</span>現(xiàn)代中國(guó)政治發(fā)展史 </dd>
<dd><span>——</span><span>11.19</span>現(xiàn)代中國(guó)物質(zhì)文明發(fā)展史(中國(guó)近現(xiàn)代社會(huì)生活的變遷、科技等)</dd>
<dd class=fff><span>——</span><span>11.30</span>古希臘羅馬的政治制度</dd></dl>
[ctrl+a 全部選擇 提示:你可先修改部分代碼,再按運(yùn)行]