Skip to main content

0408

可替换元素:​

object-fit 可替换元素, 不是由CSS来渲染的,是由浏览器来渲染的, object-position 经典的可替换元素

  1. video
  2. img
  3. iframe

特殊情况下的可替换元素: option select

input

img 属性, 其他属性有些不属于可替换元素

audio

canvas

object

Display​

块级元素可以存放块级元素与行内元素 行内元素不能放块级元素

块级元素都有的特点:

  1. display: block
  2. 可设置宽高, 设置内外边距都会影响到文档排版 行间元素特点, 不能手动设置宽高, 属性是display: inline

display: block 块级元素默认的是正常的文档流

display: inline-block 同时保持块级元素的特性, 也可以设置宽高, 又可以保持行内元素的布局

非正常文档流​

display: flex 流式布局

display:grid 栅格布局

边距塌陷​

如果相邻或父子元素都设置了相同的边距情况:

  1. 都是正数取最大,
  2. 都是负数取最小
  3. 一正一负取两个数的相加

如果两个相邻元素都设置了边距,那么就脱离文档流, 形成非正常的文档流, 需要注意

如果两个相邻元素都设置了边距, 它们的父盒子设置了BFC或者边框等情况下,不就是正常的文档流

多列布局​

column-count: 多少列