CSS学习笔记

transform属性的细节 盒模型尺寸不会变化：页面中的元素无论应用什么transform属性值，该元素的盒模型尺寸和位置都不会有任何变化 行内元素无效，无法应用transform变换，且不支持所有

CSS3以后的内容 width fit-content的两大优点： 1、保护了原始的display计算值 2、让元素的尺寸有了确定的值 逻辑属性 inline/block与start/end元素 in

CSS层叠规则 深入z-index z-index不仅只对定位元素有效，flex盒子的子元素也可以设置z-index z-index负值也无法突破当前层叠上下文的包裹 对于非浮层元素，避免设置z-in

深入行内元素 基线 字母x的下边缘是CSS中的基线 x-height：指的就是小写字母x的高度 middle指的是基线1/2 x-height的高度 对于行内元素垂直居中应该是对文字，而非居外部的块级

深入理解content content与替换元素 什么是替换元素：通过修改某个属性值呈现的内容就可以被替换的元素就称为替换元素 标志性的替换元素有：img、object、video或者表单元素text

定位 标准文档流或者浮动都无法实现的功能用定位 定位 = 定位模式 + 边偏移 定位模式： 定位模式决定元素定位方式，通过position设置 静态定位（默认） position：static 相对定

盒子模型 包括：边框、内边距、外边距、实际内容，边框会影响定好宽高的盒子大小 内边距 padding：边框与内容之间的间距 padding复合写法，四个值是上右下左，顺时针方向设置 padding也会

啥是“流” 流实际上是CSS中的一种基本的定位和布局机制 啥是流体布局 指的是利用元素流的特性实现的各类布局效果。因为流本身具有自适应特性，所以流体布局也具有自适应性 注意：流的特性不适用于table

多类名 id选择器：id只能调用一次，别的标签不能使用 字体复合属性顺序：font-style font-weight font-size font-family line-height：属性用于设置