DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> WEB網站前端 >> 網頁特效代碼 >> DIV和LI實現表格
DIV和LI實現表格
編輯:網頁特效代碼     
<!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">
<!--
#hovertreetable{ font-site:12px;line-height:24px; }
#hovertreetable{width:100%}
#hovertreetable li{ list-style-type:none; float:left; display:block; width:30%; border:1px solid #99CC00; padding-left:15px;}
#hovertreetable .title{ font-weight:bold; background:#F1FADE;}
-->
</style>
</head>

<body>
<div id="hovertreetable">
<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>

效果如下:
  • 姓名
  • 班級
  • 年齡
  • 何問起
  • 2-2
  • 16
  • 3-2
  • 18
  • 李四
  • 3-3
  • 15
  • XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
    Copyright © DIV+CSS佈局教程網 All Rights Reserved