为了账号安全,请及时绑定邮箱和手机立即绑定

正在回答

2 回答

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>demo</title>

<style type="text/css" media="screen">

.wrap{

position:relative;

width:700px;

margin:0 auto;

}

div{

width: 100px;

height: 100px;

}

.left{

background-color: red;

float:left;

}

.right{

background-color:blue;

float:left

}

.left1{

background-color:green;

position:absolute;

left:0;

top:110px;

}

.right1{

background-color:pink;

position:absolute;

left:110px;

top:110px;

}

</style>

</head>

<body>

<div class="wrap">

<div class="left"></div>

<div class="right"></div>

<div class="left1"></div>

<div class="right1"></div>

</div>

</body>

</html>


http://img1.sycdn.imooc.com//581fe3a8000132c003750245.jpg


0 回复 有任何疑惑可以回复我~

两种吧,一种是为元素设置float属性,还有一种就是为父元素设置相对定位,子元素自适应跨宽度部分设置绝对定位,且设置margin-left属性值

1 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消
网页布局基础
  • 参与学习       214707    人
  • 解答问题       1756    个

让你精通CSS中三大定位机制,彻底掌握网页布局的相关知识

进入课程

实现浮动的机制有哪几种

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信