发表于: 2019-04-29 23:21:25

1 663


今天完成的事:复习一些旧知识

遇到的问题:无

明天计划:修改任务9,完成任务10

收获:

复习了下position的印象,看了关于overflow相关资料。


body有无position:relative对相对于其定位的元素的影响

给设置了postion:absolute的元素相对于 static 定位以外的第一个父元素进行定位,如果找不到这样的一个父元素,则相对于body定位。但是这是body设置了position了没有设置position是有区别的。 


如果body没有设置除position之外的其他值,则设置了position:absolute;的元素占据的位置由当前窗口大小决定。 

如果body设置了position:relative;(或其他非static的值),则设置了position:absolute;的元素则是整个body的范围。




元素的overflow属性是用来规定当内容溢出元素框时发生的事情,设置单个方向的overflow-x和overflow-y同理,它有五个值,visible(默认),hidden,scroll,auto,inherit,现在我们先来简单说下这几个属性值: 

visible:默认值,它会把内容完全展现出来,即使内容超出已定义的父元素大小,它还是会超出部分按正常显示,但是也不会影响其他元素的布局。 

hidden:当内容超过父元素大小,内容会被修剪,其余部分不可见。 

scroll:当内容超过父元素大小,内容会被修剪,但是浏览器会显示滚动条以便查看其余的内容。 

auto:根据元素内容是否超出来自动控制,当内容超过父元素大小,则如果内容被修剪,浏览器会显示滚动条以便查看其余的内容,不超出则正常显示。 

inherit:从父元素继承该属性的值。



返回列表 返回列表
评论

    分享到