资讯专栏INFORMATION COLUMN

深入学习CSS布局系列(一)布局常用属性

Noodles / 3097人阅读

摘要:布局涉及到的属性常用属性值此元素不会被显示它和属性不一样。当所有父元素中的所有元素脱离文档流之后,父元素将失去原有默认的内容高度浮动塌陷配合使用属性规定元素的哪一侧不允许其他浮动元素。

@(CSS技巧)[CSS, 布局]

深入学习CSS布局系列(一)布局常用属性

一直感觉自己对CSS的各个属性很了解,可是在前几天一次面试后发现自己真的很多地方感觉自己知道,可是实际上自己并不是真的理解了,不论学什么,基础太重要了,因此决定花几天时间深入的学习下布局涉及到的方方面面,本系列文章预计从布局常用属性的解析,布局所涉及到的重要概念的解析以及常见布局样式的实现及解析三部分来完成,以期在自己完成三部分的学习之后能在大脑里有一个完整的布局体系。

布局涉及到的属性 display
常用属性值:

none:此元素不会被显示,它和 visibility 属性不一样。把 display 设置成 none 不会保留元素本该显示的空间,但是 visibility: hidden; 还会保留。

block:此元素将显示为块级元素,此元素前后会带有换行符。

inline:默认。此元素会被显示为内联元素,元素前后没有换行符。

inline-block: 行内块元素。

list-item: 此元素会作为列表显示。

inherit:规定应该从父元素继承 display 属性的值。

常见元素默认属性值

block:

,

,

~

,