如何只用html做出这个表格？（不要嵌套）_随笔

您好：您可以这样，用table的话就是嵌套了。你可以用div+css来做。demo代码如下：

</body>

将body替换掉你建好的网页中的body就可以看到效果了，注意没用嵌套哦。这只是个demo，css样式最好单独写在样式表中，这样能省下很多代码哦。如有问题请加：1534968714，QQ聊即可。

希望采纳……

用div做成表格的形式

把标签中间的空格都去掉就OK了

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0

Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"

<head >

charset=gb2312" />

<title >强强的博客-用div做表格完美版 </title>

</head>

body{ margin:0pxpadding:0pxfont-family:Microsoft

Yahei,Tahoma,Verdana,STHeiTi,simsun,sans-seriffont-size:14px

background-image:url(../images/t_bg.jpg)

background-repeat:no-repeatbackground-color:#000}

ul,li{ list-style-type:nonepadding:0pxmargin:0px}

a { color:#ffftext-decoration:none}

a:hover { color:#F30text-decoration:none}

#tab{

width:645px

height:auto

margin:0 auto

background-color:#e5f2f4

}

.lititle{

width:643pxborder:1px dotted #f3f3f3

line-height:40pxfont-size:16pxfont-weight:bold

color:#000

}

.cont {

}

.cont li{

list-style:none

float:left

border-left:1px dotted

#f3f3f3

border-bottom:1px dotted #f3f3f3

border-right:1px dotted #f3f3f3

height:24px

background-color:#395560

line-height:24px

color:#f3f3f3

}

.li1{

width:50px

list-style:none

float:left

text-align:center

border-right:1px dotted #f3f3f3

}

.li2{

width:140px

list-style:none

float:left

text-align:center

border-right:1px dotted

#f3f3f3}

.li3{

width:400px

list-style:none

float:left

text-align:center

border-right:1px dotted

#f3f3f3}

.li4{

width:50px

float:left

text-align:center

}

.liwz{

width:451px

float:left

text-align:center

}

.lititle{ display:block

text-align:center}

</style>

<body >

<div class="lititle">强强的博客-用div做表格完美版

</div>

<ul ><li ><span

class="li1"><b >排序 </b></span><span

class="li2"><b >名称 </b></span><span

class="liwz"><b >网址 </b></span><

/li><li ><span class="li1">1 </span><

span class="li2">强强的博客 </span><span