红色代码 ：图一 左右两边固定宽度div，（随屏幕宽度改变）中间div自适应填满中间的空间
紫色代码：图二 宽高固定的div，（随屏幕宽度改变）水平自适应居中
蓝色代码：图三 宽高不知道的div，（随屏幕宽度改变）水平自适应居中
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
.bl{width: 30px;height:100px;float: left;background-color: salmon;}
.br{width: 30px;height:100px;float: left;background-color: aqua;}
.bc{margin: 0 30px 0 30px; }
.boxA{width: 100%;height:100px;float: left;background-color: azure;}
</style>
</head>
<body>
<div class="bl"></div>
<div class="bc">
<div class="boxA">用内容测测试用的内容</div>
</div>
<div class="br"></div>
</body>
</html>
.div { width:200px; height:200px; position:absolute; left:50%; top:50%; margin-left:-100px; margin-top:-110px; background:#f90;}
<div class="div">已知宽高的div自适应居中</div>
.a{float:left;height:50px;width:50%;margin-left:50%;background-color: aqua;}
.b{right:50%;height:40px;position: relative;background-color: red;}
<div class="a">
<div class="b">测测试用的内容</div>
</div>
837
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
