7小时玩转网页布局开发【新】——5.高级技巧之多列等高

最新推荐文章于 2021-08-17 17:14:15 发布

Superstatus

最新推荐文章于 2021-08-17 17:14:15 发布

阅读量335

点赞数

分类专栏： Html 文章标签： Html

本文链接：https://blog.csdn.net/Superstatus/article/details/80624372

版权

Html 专栏收录该内容

8 篇文章 0 订阅

订阅专栏

本文解决双飞翼的问题！

效果：

代码：

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>双飞翼演示</title>
	<style>
		body{ margin:0; }
		.container {  width: 100% ; overflow: hidden;}
		.container div{ float: left; min-height: 200px; margin-bottom: -9999px; padding-bottom: 9999px; }
		.container .body{ width: 100%; }
		.container .body div{ margin:0 120px; background: #cccccc; float:none;margin-bottom: -9999px; }
		.container .left{ width: 100px; background: red; margin-left: -100%;}
		.container .right{ width: 100px; background: blue; margin-left:-100px; }
	</style>
</head>
<body>
	<div class="container">
		<div class="body">
			<div>
			中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间<br/>
			中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间<br/>
			中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间<br/>
			中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间<br/>
			中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间中间<br/>
			中间中间中间中间中间中间中间中间中间中间中间中间<br/>
			中间中间中间中间中间中间中间中间中间中间中间中间<br/>
			中间中间中间中间中间中间中间中间中间中间中间中间<br/>
			中间中间中间中间中间中间中间中间中间中间中间中间<br/>
			中间中间中间中间中间中间中间中间中间中间中间中间<br/>
			中间中间中间中间中间中间中间中间中间中间中间中间<br/>
			中间中间中间中间中间中间中间中间中间中间中间中间<br/>
			中间中间中间中间中间中间中间中间中间中间中间中间<br/>
			中间中间中间中间中间中间中间中间中间中间中间中间<br/>
			中间中间中间中间中间中间中间中间中间中间中间中间<br/>
			中间中间中间中间中间中间中间中间中间中间中间中间<br/>
			中间中间中间中间中间中间中间中间中间中间中间中间<br/>
			中间中间中间中间中间中间中间中间中间中间中间中间<br/>
			中间中间中间中间中间中间中间中间中间中间中间中间<br/>
			</div>
		</div>
		<div class="left">左侧</div>
		<div class="right">右侧</div>

	</div>
</body>
</html>

Superstatus

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
7小时玩转网页布局开发【新】——5.高级技巧之多列等高

本文解决双飞翼的问题！效果：代码：&lt;!DOCTYPE html&gt;&lt;html lang="en"&gt;&lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;双飞翼演示&lt;/title&gt; &lt;style&gt; body{ margin:0; } .con
复制链接

扫一扫