如何用CSS定义表格与模拟表格

html-css018

如何用CSS定义表格与模拟表格,第1张

用div模拟表格而已:

<body> 

<dividdivid="wrapper"> 

<dividdivid="header"></div> 

<dividdivid="main"> 

<dividdivid="nav"> 

?navigationcolumncontent…  

</div> 

<dividdivid="extras"> 

?newsheadlinescolumncontent…  

</div> 

<dividdivid="content"> 

?mainarticlecontent…  

</div> 

</div> 

</div> 

</body>

css样式

#main{  

display:table  

border-collapse:collapse  

}  

 

#nav{  

display:table-cell  

width:180px  

background-color:#e7dbcd  

}  

 

#extras{  

display:table-cell  

width:180px  

padding-left:10px  

border-right:1pxdotted#d7ad7b  

}  

 

#content{  

display:table-cell  

width:380px  

padding-left:10px  

}

其实每种浏览器都一般的表格元素都支持很好,没有必要去用CSS来实现。

表格,它本身就是表格,承载的是存放数据并罗列出来;2004年美国网页设计专家Zeldman在《网站重构》(这是中文翻译)中就说道,表格,它就是一个表格,承载数据用,没有别的含义,在Web的真正标准中,表格是不能用来做为网页布局排版的。

如果非要用CSS进行表格制作,请看另一个百度知道主题:

http://zhidao.baidu.com/question/29540501.html

不晓得我的答案,你满意否?