关于圣杯布局的一些疑问,求解!

关于圣杯布局的一些疑问,求解!

margin-left: -100%; left往左移动100%,为什么是参照父元素的宽度而不是浏览器的宽度,且父元素也没有设置宽度。http://img1.sycdn.imooc.com//climg/5ca225be0001e77306730832.jpg

正在回答

登陆购买课程后可参与讨论,去登陆

3回答

同学你好, 这里可以这样理解

  1. margin-left是相对前一个元素或者父级左边缘的边距。规定里设置为百分比是基于父元素的宽度的

  2. left是对设置了定位属性的元素才生效的,表示元素距离参照位置的左侧距离

    1)相对定位, left设置百分比是基于父级元素宽度计算的

    2)绝对定位, left设置百分比是基于最近的有定位属性(不包括静态定位)的祖先元素宽度计算的,

    3)固定定位,left设置百分比是基于浏览器视口宽度设置的

  3. 父元素是块级元素, 默认占据一行, 元素的宽度如果不设置的话,默认为父元素的宽度。

如果帮助到了你, 欢迎采纳

祝学习愉快~~~

提问者 很多本正经的男人 2019-04-02 20:48:58

老师你说的是不是container直接给个padding值 不给width :100%;是为了防止页面出现横向滚动条

给middle加width:100%;是让浏览器自动检测加过padding值的父元素宽度。

提问者 很多本正经的男人 2019-04-02 13:33:33

给.container设置padding值是为了给.middle设置宽度的吗?

  • 这里是为了实现左右两边宽度固定,中间宽度自适应。 .container设置左右padding值。给左右两边留出了位置, 另, middle是块级元素。默认占据一行, 元素的宽度如果不设置的话,默认为父元素的宽度
    2019-04-02 13:50:42
问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
前端小白入门系列课程
  • 参与学习           人
  • 提交作业       11218    份
  • 解答问题       36713    个

从一个不会编程的小白到一个老司机是需要过程的,首先得入门,学习基础知识,然后才能进阶,最后再到精通,本专题是你走进前端世界的不二选择!

了解课程
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师