让div左右对齐自适应高度的网页特效(常看)

简介:



原文:http://www.360doc.com/content/13/0723/09/8445249_301885130.shtml

<!DOCTYPE HTML >
<html>

	<head>
		<meta charset="utf-8">
	
		<style type="text/css">
			.box { border:1px solid #006699; width:500px; overflow: hidden; }
			.box .left { float:left; width:30%; background:red; padding-bottom:3000px; margin-bottom:-3000px; }
			.box .right { float:right; width:70%; background:green; padding-bottom:3000px; margin-bottom:-3000px; }
		</style>
	</head>

	<body>
		
		<div class="box">
			<div class="left">
				 <h1>wo</h1> <h1>wo</h1> <h1>wo</h1>
			</div>
			<div class="right">
				 <h1>wo</h1>
			</div>
		</div>
	</body>

</html>


目录
相关文章
|
4月前
|
前端开发
【CSS】解决图片和盒子底部产生的缝隙问题
【CSS】解决图片和盒子底部产生的缝隙问题
|
5月前
|
前端开发
使用css样式淡化body背景图片的实现方法
使用css样式淡化body背景图片的实现方法
|
前端开发 JavaScript
div在网页中四周留个等宽“包边”的办法
div在网页中四周留个等宽“包边”的办法
56 0
div在网页中四周留个等宽“包边”的办法
|
前端开发 JavaScript
div在网页四周留个等宽“包边”的办法
div在网页四周留个等宽“包边”的办法
67 0
div在网页四周留个等宽“包边”的办法
|
前端开发
内容滚动条和子 div 高度自适应
一个div里面,两个子div高度自适应(平分父div的高度)和元素内容过多的时候,根据需求出现高度滚动条或者宽度滚动条。 先放最终效果(在下面会有demo代码。): Paste_Image.png 实现这些效果要怎么做呢?咱一步一步来。 第一步: 先设置html结构:这里我已经搭好了。 第二步然后开始写css样式了 设置父元素box的样式 设置box1的样式 现在尝试把html解除注释 下面就到了关键的部分了(文章末尾有demo,不想看的话,可以自己试试。): 在上面我们已经设置了最大高度和最小高度,因为box1空间不够所以溢出来了。
722 0
内容滚动条和子 div 高度自适应
|
前端开发
如何用纯css实现div框四个角的点缀
用纯css实现div框四个角的点缀
817 0
|
XML 前端开发 JavaScript
【问题归纳】前端开发问题集 | css 设置div宽高比1:2 上
【问题归纳】前端开发问题集 | css 设置div宽高比1:2
312 0
|
Web App开发 JSON 前端开发
【问题归纳】前端开发问题集 | css 设置div宽高比1:2 下
【问题归纳】前端开发问题集 | css 设置div宽高比1:2
241 0
【问题归纳】前端开发问题集 | css 设置div宽高比1:2 下
|
移动开发 前端开发
CSS - H5 Swiper 快速滑动白色闪屏解决方案
CSS - H5 Swiper 快速滑动白色闪屏解决方案
571 0
CSS - H5 Swiper 快速滑动白色闪屏解决方案
|
前端开发
css两种常用的不定宽高的水平垂直居中方法,记住它,不再为样式发愁
我们在设计网页时,会大量的运用到水平垂直居中,如果知道元素的宽高,那水平垂直居中是很简单的,无非是用一下margin就可以完成,这里就不向大家做过多的解释了。但是,如果 不知道元素的宽高呢? 是不是就会在这上面用点心思了,接下来我给大家介绍两种我设计网页时常用的两种不定宽高的元素水平居中方法吧,放心绝对容易记。
595 0
css两种常用的不定宽高的水平垂直居中方法,记住它,不再为样式发愁

热门文章

最新文章