问答详情
源自:5-1 网页布局-编程挑战

margin-right:0px,最后一个任务用这样子为什么不行呢

#right{margin-right:0px;top:0px;position:absolute;border:1px solid #999;}为什么右边这样子写不行,要用margin-left才能正常显示呢,margin-right就会显示重叠在最左边,为什么呀

提问者:前方cxf 2016-04-25 13:06

个回答

  • 骑猪跑的程序员
    2016-04-28 02:04:09
    已采纳

    关于right属性无效的原因:right属性只有在position是absolute的情况下才有效,而默认的position值是static,right属性是无效的。建议能不使用right就不要使用right属性


    看到别人的解释是这样的,但是我还是疑惑不解。我尝试了与你类似的代码发现right属性是无效的,不知为何

  • 浪迹天涯一
    2016-05-04 15:13:08

    这里就要深刻理解一下margin及position了,margin是外边距,什么是外边距呢?这里就不得不说一下盒子模型了,我们把盒子比喻为一个封闭的div也就是块状元素,两个盒子之间的间距就是外边距,盒子与里面物品间的间距就是内边距,盒子自身就是边框。而position(位置)都是有相对性的,如果屏幕上空空框框啥都没有,那么它是相对于屏幕的边线来定位的,如果它是被包裹在块状元素中,那么他就是相对于这个块状元素来定位的。

    综上所述:你的问题这里,当这个#right的div不设宽高时,它是与上一个div重合的,充满整个框架,所以margin是0px,当你设置宽度时,它是默认居左上角顶格的,也就是margin-left:0px;margin-top:0px;所以这时候margin-left及margin-top是起作用的,margin-right及margin-bottom虽然也起作用,但是要当你设置的间距大于原先固定间距时才能看出效果。

  • 前方cxf
    2016-04-25 19:36:54

    还是不解,就算是与浏览器之间的间距,那也是距离浏览器右边,可为什么是在左边间距0呢

  • qq_快乐向往_03182652
    2016-04-25 15:10:53

    margin-right:是right这个元素与浏览器之间的间距,而left则是与medium的间距