怎么用HTML做这样一个表格？
你确定这是一个表格？不是一个页面布局？
首先要分析布局，像这样的，首先一个大盒子装着上下两个div,然后下面的div里面有3块，先分左右两块，然后右边的可以通过定位来写
这个是效果图，代码如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>html布局</title>
<style type="text/css">
html,body{
margin:0;
}
.fl{
float:left;
}
.fr{
float:right;
}
.ovf{
overflow: hidden;
}
.box{
width: 100%
}
.box-shang{
width:90%;
margin:0 auto;
line-height: 80px;
text-align: center;
border:1px solid #000;
}
.box-xia{
width:90%;
margin:0 auto;
border:1px solid #000;
}
.box-xia .xia-lef{
border:1px solid #000;
width:30%;
text-align: center;
line-height: 500px;
}
.box-xia .xia-rig{
border:1px solid #000;
width:calc(70% - 4px);
text-align: center;
line-height: 500px;
position: relative;
}
.rig-dw{
width:50%;
line-height: 350px;
position: absolute;
top:0;
left:0;
border:1px solid #000;
}
</style>
</head>
<body>
<div class="box">
<div class="box-shang">上面部分</div>
<div class="box-xia ovf">
<div class="fl xia-lef">下面左边部分</div>
<div class="fl xia-rig">
<div class="rig-dw">我是定位过来的</div>
</div>
</div>
</div>
</body>
</html>
博思aippt
2024-07-20 广告
