程序博客网 > 12 fan club动作数据

两侧高度相互适应的CSS+div布局

来源：互联网发布：12 fan club动作数据编辑：程序博客网时间：2024/05/16 11:42

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>左右均能适应的布局</title>
<style type="text/css">
.main{
width:200px;
background:#C6F;
}/*定义父元素的CSS样式*/
.content1{
position:relative;
float:right;
margin-right:-200px;
width:200px;
background:#C60;
color:#ffffff;
}/*定义子元素1的CSS样式*/
.content2{
float:left;
width:200px;
margin-left:-200px;
background:#C6F;
position:relative;
color:#CCC;
border:0 #C6F solid;
}/*定义子元素2的CSS样式*/
.clear{
clear:both;}
/*使用清除浮动的元素*/
</style>
</head>

<body>
<div class="main">
<div class="content1">
<div class="content2">
使用负边界元素的部分<br/>使用负边界元素的部分<br/>使用负边界元素的部分<br/>使用负边界元素的部分<br/>左边增加部分<br/>左边增加部分<br/>左边增加部分<br/>左边增加部分<br/>左边增加部分<br/>左边增加部分<br/>
</div>
<div>
这是一个高度自适应的示例，注意元素高度的变化。理解这个自适应的具体含义<br/>

</div></div>
<div class="clear"></div></div>

</body>
</html>

1.左边适应右边高度变化

2.右边适应左边高度变化

12 fan club动作数据

12 fan club动作数据

原创粉丝点击

热门问题 老师的惩罚人脸识别我在镇武司摸鱼那些年重生之率土为王我在大康的咸鱼生活盘龙之生命进化天生仙种凡人之先天五行春回大明朝姑娘不必设防，我是瞎子眼线怎样不晕染防晕染睫毛膏多色晕染美甲教程眼线总是晕染怎么办眼线膏不晕染眼影晕染刷验孕棒一片晕染的红渐变晕染美甲图片美甲晕染的晕染手法不晕染眼线膏睫毛膏不晕染晕染美甲的方法与技巧晕染眼影刷哪款眼线液不晕染美宝莲眼线膏晕染吗什么眼线膏不晕染怎么画眼线不晕染眼线液防水不晕染哪个眼线笔不晕染哪种眼线笔不晕染哪款眼线膏不晕染什么眼线笔好用不晕染眼线膏怎么用不晕染哪款睫毛膏好用不晕染哪款眼线膏好用不晕染哪款眼线笔好用不晕染哪款眼线液好用不晕染内眼线用什么画不晕染什么眼线液笔好用不晕染晕痣中间痣消失是好是坏晕痣是怎么回事脸部痣额头痣晕痣会扩散吗眉心痣晕痣早期的图片痣可以点掉吗痣怎么去晕痣是怎样引起的晕痣是什么病得了晕痣怎么办