CSS完美实现的表格_层和布局特效

模板酷站

      织梦DedeCMS视频教程买空间 租服务器 选网硕互联! 无忧站长工具,百度权重一键全查!

      用CSS完美实现的表格布局,具体一点就是用CSS的LI列表实现的表格,新手朋友值得借鉴一下哦,不然又在为CSS编写表格效果而发愁了,这是个很不错的参考实例。

      <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" mrc="text/html; charset=gb2312" /> <title>CSS表格</title> <style type="text/css"> <!-- body{ font-site:12px;line-height:24px; } #text{width:100%} #text li{ list-style-type:none; float:left; display:block; width:30%; border:1px solid #99CC00; padding-left:15px;} #text .title{ font-weight:bold; background:#F1FADE;} --> </style> </head> <body> <div id="text"> <li class="title">姓名</li> <li class="title">班级</li> <li class="title">年龄</li> <li>王五</li> <li>2-2 </li> <li>16</li> <li>张三</li> <li>3-2</li> <li>18</li> <li>李四</li> <li>3-3</li> <li>15</li> </div> </body> </html>

      所属频道:层和布局特效/更新时间:2013-01-08