您的位置:首页 > 其它

div 实现表格布局

2015-06-07 10:01 148 查看
<html>
<head>
<style>
div.table{
font-size:0;
width:400px;
border-top-style: solid;
border-top-width: 1px;
border-left-style: solid;
border-left-width: 1px;
margin:0 auto;
}

div.table>div>div{
font-size:18;
border-right-width: 1px;
border-right-style: solid;
border-bottom-width: 1px;
border-bottom-style: solid;
width:199px;
display:inline-block;
margin:0px;
padding:0px;
text-align: center;
}

div.table>div:first-child{
background-color:pink;
}

</style>
</head>
<body>
<div class="table" >
<div>
<div>ID</div>
<div>Name</div>
</div>

<div>
<div>001</div>
<div>xiaohong</div>
</div>

<div>
<div>002</div>
<div>xiaohong</div>
</div>

<div>
<div>003</div>
<div>xiaohong</div>
</div>

<div>
<div>004</div>
<div>xiaohong</div>
</div>

<div>
<div>005</div>
<div>xiaohong</div>
</div>

</div>

</body>
</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: