怎么让DIV在另一个DIV里靠底部显示?

<divclass="1"><divclass="2">XXXX</div></div>我想要div2在div1靠底部显示,这里两个属性要怎么写??... <div class="1">
<div class="2">XXXX</div>
</div>
我想要div2在div1靠底部显示,这里两个属性要怎么写??
展开
 我来答
看天下小事
2018-08-19 · TA获得超过489个赞
知道答主
回答量:41
采纳率:0%
帮助的人:1.2万
展开全部

可以使用css的position属性的绝对定位。

如图所示:

拓展知识

position 属性指定了元素的定位类型。

position 属性的五个值:

  • static:HTML元素的默认值,即没有定位,元素出现在正常的流中。静态定位的元素不会受到 top, bottom, left, right影响。

  • relative:相对定位元素的定位是相对其正常位置。

  • fixed:元素的位置相对于浏览器窗口是固定位置。即使窗口是滚动的它也不会移动:

  • absolute:绝对定位的元素的位置相对于最近的已定位父元素,如果元素没有已定位的父元素,那么它的位置相对于<html>:

  • sticky:ticky 英文字面意思是粘,粘贴,所以可以把它称之为粘性定位。position: sticky; 基于用户的滚动位置来定位。

  • 元素可以使用的顶部,底部,左侧和右侧属性定位。然而,这些属性无法工作,除非是先设定position属性。他们也有不同的工作方式,这取决于定位方法。



素颜以对时代
2018-05-22 · TA获得超过9.1万个赞
知道答主
回答量:40
采纳率:56%
帮助的人:6130
展开全部
#CSS
.1 {position:relative;}
.2 {position:absolute;left;0;bottom:0;}
#HTML
<div class="1">
<div class="2"></div>
</div>

如果 DIV1 里 只有 DIV2 的话
在DIV2 CSS样式里 加一个 margin-top:10px;
10px 改成你要数值
或者在 DIV1 里加个 内边距 padding-top:10px;
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
斯奈克杰罗
2011-08-07 · TA获得超过223个赞
知道答主
回答量:39
采纳率:0%
帮助的人:56.6万
展开全部
#CSS
.1 {position:relative;}
.2 {position:absolute;left;0;bottom:0;}
#HTML
<div class="1">
<div class="2"></div>
</div>
不影响其他元素的情况下定位最好...

如果 DIV1 里 只有 DIV2 的话
在DIV2 CSS样式里 加一个 margin-top:10px;
10px 改成你要数值
或者在 DIV1 里加个 内边距 padding-top:10px;
本回答被提问者采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
abiao5555
2011-08-07 · TA获得超过591个赞
知道小有建树答主
回答量:516
采纳率:0%
帮助的人:496万
展开全部
<div id="div1" style="border:1px solid red; width:500px; position:relative; height:500px;">
1111111
<div id="div2" style="border:1px solid green; width:300px; height:200px; position:absolute; bottom:0px;">2222222222</div>
</div>

父元素position不能是static(默认值)
子元素potiosn需要是absolute
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
油腻小肚
2011-08-06 · TA获得超过1658个赞
知道小有建树答主
回答量:891
采纳率:75%
帮助的人:605万
展开全部
margin-bottom:0px;
追问
是哪个的属性??
追答
在class=“2”这个里面设置他的margin-bottom:0px;
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 1条折叠回答
收起 更多回答(3)
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式