412day（主题部分广告）

最新推荐文章于 2025-10-01 00:15:00 发布

原创最新推荐文章于 2025-10-01 00:15:00 发布 · 127 阅读

0 ·

CC 4.0 BY-SA版权

本文详细介绍了使用CSS进行网页布局的方法，包括如何使用不同的定位方式、背景属性以及绝对定位来实现广告和主要内容区域的并行显示。通过具体代码示例，展示了高度、背景颜色、相对和绝对定位等CSS属性的应用。

《2018年11月20日》【连续412天】

标题：主题部分广告；
内容：

<!-- main 部分 -->
	 <div class="jd">
	 	<div class="w jd-inner"></div>
	 	<div class="ad">
	 		<a href="#"></a>
	 	</div>
	 </div>

.jd {
	height: 480px;
	background-color: pink;
	position: relative;
}
.jd-inner {
	height: 480px;
	background-color: skyblue;
	position: relative;
	z-index: 1;
}
.ad {
	height: 480px;
	background: url(../images/bg.png) no-repeat top center;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%; /*重要*/
}
.ad a {
	width: 100%;
	height: 100%;
	display: block;
}