美文网首页
前端学习(十三)

前端学习(十三)

作者: 永恒幻羽 | 来源:发表于2020-01-10 21:03 被阅读0次

    display:

    将一个内联元素转化为块元素;可选:inline(将一个元素作为内联元素显示),block(将一个元素设置块元素显示),inline-block(行内块元素),none(消除该元素)

    visiblility:

    设置元素的隐藏和显示的状态,可选visible(默认显示),hidden (隐藏),但位置依旧存在。

    overflow:

    子元素默认存在于父元素的内容区,理论上讲子元素的大小应不大于父元素,若超出了父元素,则超过的部分则默认会在父元素外显示,而overflow可以规定元素框发生溢出的处理方式。visible(默认值,不处理),hidden(溢出内容不可见),scroll(添加滚动条,但不溢出也会有滚动条),auto(自动添加滚动条,不溢出无滚动条)

    文档流:

    文档流处在网页的最底层,表示一个页面的位置,创建的文档都默认在文档流中。元素在文档流中的特点:块元素:1.块元素在文档中自上向下排列,独占一行;2.块元素在文档流中默认宽度为父级元素,3.块元素在文档流中默认的高度会被内容撑开。内联元素:1.内联元素在文档流中只占自身大小,从左向右排列,不足者换行,2.在文档流中。内联元素被内容撑开。

    浮动:

    块元素在文档流中默认垂直排列,所以元素会自上而下排开,如果希望块元素在页面中水平排列,可以使用float块元素脱离文档流,

    可选值:none(默认值,元素默认存留在文档流中排列),left(元素会立即脱离文档流,像页面的左侧浮动),right(同前,像页面右侧浮动),

    浮动的位置规律:元素浮动后,会尽量向页面的左上或右上浮动,直到遇到父元素的边框或着其他浮动元素;如果浮动元素上边是一个没有浮动的块元素,则浮动元素不会超过块元素,浮动的元素不会超过他的每一个兄弟元素。

    浮动特点:1.不会覆盖重叠块上的文字;2.内联元素脱离文档流后会变成块元素

    相关文章

      网友评论

          本文标题:前端学习(十三)

          本文链接:https://www.haomeiwen.com/subject/djqmactx.html