怎样把一个DIV放到另一个div右下角
5个回答
展开全部
可以用css定位把一个div放到另一个div右下角。
1、新建html文档，在body标签中添加一个div标签，然后在这个div标签内再添加一个div标签，为外面的div标签添加“container”类，里面的div标签添加“inner”类：
2、在head标签内添加style标签，为“container”类和“inner”类分别设置样式，这时默认情况下内div在外div的左上角：
3、为外div添加样式“position: relative;”，为内div添加样式“position: absolute;right: 0;bottom: 0;”，这时内div将会在外div的右下角：
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
借助CSS定位来实现，你将右下角的那个DIV放在另一个DIV里面，参考代码如下示：
<div id="box1">
<div id="box2">测试内容</div>
</div>
<style>
<!--
#box1{width:600px;height:600px;background:green;position:relative}
#box1 #box2{width:200px;height:200px;background:red;position:absolute;right:0;bottom:0}
-->
</style>
父对象相对定位，子对象以父对象为参考点绝对定位；
外层的div设置为相对定位，内层的div设置为绝对定位；
<div id="box1">
<div id="box2">测试内容</div>
</div>
<style>
<!--
#box1{width:600px;height:600px;background:green;position:relative}
#box1 #box2{width:200px;height:200px;background:red;position:absolute;right:0;bottom:0}
-->
</style>
父对象相对定位，子对象以父对象为参考点绝对定位；
外层的div设置为相对定位，内层的div设置为绝对定位；
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
2018-07-29 · 百度知道合伙人官方认证企业
育知同创教育
1【专注：Python+人工智能|Java大数据|HTML5培训】 2【免费提供名师直播课堂、公开课及视频教程】 3【地址：北京市昌平区三旗百汇物美大卖场2层，微信公众号：yuzhitc】
向TA提问
关注
![]()
展开全部
可以借助CSS定位来实现，将右下角的那个DIV放在另一个DIV里面，参考代码如下示：
<div id="box1">
<div id="box2">测试内容</div>
</div>
<style>
<!--
#box1{width:600px;height:600px;background:green;position:relative}
#box1 #box2{width:200px;height:200px;background:red;position:absolute;right:0;bottom:0}
-->
</style>
父对象相对定位，子对象以父对象为参考点绝对定位；
外层的div设置为相对定位，内层的div设置为绝对定位；
<div id="box1">
<div id="box2">测试内容</div>
</div>
<style>
<!--
#box1{width:600px;height:600px;background:green;position:relative}
#box1 #box2{width:200px;height:200px;background:red;position:absolute;right:0;bottom:0}
-->
</style>
父对象相对定位，子对象以父对象为参考点绝对定位；
外层的div设置为相对定位，内层的div设置为绝对定位；
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
可以设置div的margin属性值，也就是外边距的取值。
也可以通过定位来设置
也可以通过定位来设置
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<style>
div{
width:500px;
height:500px;
border:1px solid #000;
}
.div{
margin-left: 501px;
}
</style>
<body>
<div></div>
<div class="div"></div>
</body>
</html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<style>
div{
width:500px;
height:500px;
border:1px solid #000;
}
.div{
margin-left: 501px;
}
</style>
<body>
<div></div>
<div class="div"></div>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（3）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
