博客小子:记录我们对互联网和生活的探索! 注册 | 登陆

div+css的两列显示代码

Tags: div, css, 布局

如果使用表格来布局的话我会疯的。

前几天我试图用表格来布局,无奈之下不得不研究这个东西。

呵呵,其实主要指定宽度就能实现这个效果~~

再也不用为程序控制表格的td而烦恼

只要修改宽度,3列,4列的效果也就出来了

XML/HTML代码
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
  2. <html xmlns="http://www.w3.org/1999/xhtml">  
  3. <head>  
  4. <title>li测试</title>  
  5. <style>  
  6. * {font-size:12px;}   
  7. #test {}   
  8. #test li {width:80px;float:left;padding-left:20px;}   
  9. </style>  
  10. </head>  
  11. <body>    
  12.   
  13. <div style="width:300px;">  
  14. <ul id="test">  
  15.     <li>我是英雄</li>  
  16.     <li>我是天才</li>  
  17.     <li>列表背景</li>  
  18.     <li>背景图片</li>  
  19. </ul>  
  20. </div>  
  21. </body>  
  22. </html>    

图片附件:
大小: 3.54 K
尺寸: 256 x 117
浏览: 56 次
点击打开新窗口浏览全图

Tags: div, css, 布局

« 上一篇:仿金融界的tab选项卡效果 | 下一篇:在表格中smarty如何分列(2列或者3列显示) »

只显示10条记录相关文章

Trackbacks

点击获得Trackback地址,Encode: UTF-8

发表评论

评论内容 (必填):