CSS 解决HTML中n换行

 white-space: pre-line;

这样n就能被识别，自动换行。

设置

- 阅读剩余部分 -

定义一个名为 "--main-bg-color" 的属性，然后使用 var() 函数调用该属性：

:root {
  --main-bg-color: coral;
}
 
#div1 {
  background-color: var(--main-bg-color);
}
 
#div2 {
  background-color: var(--main-bg-color);
}

var(custom-property-name, value)
值 描述
custom-property-name 必需。自定义属性的名称，必需以 -- 开头。
value 可选。备用值，在属性不存在的时候使用。

:root {
  --main-bg-color: coral;
  --main-txt-color: blue;
  --main-padding: 15px;
}
 
#div1 {
  background-color: var(--main-bg-color);
  color: var(--main-txt-color);
  padding: var(--main-padding);
}
 
#div2 {
  background-color: var(--main-bg-color);
  color: var(--main-txt-color);
  padding: var(--main-padding);
}

实例
修改所有图片的颜色为黑白 (100% 灰度):

- 阅读剩余部分 -

高度坍塌
成因

父元素 div 未设置高度
子元素全部设置浮动（float: left | right;），浮动元素 脱离文档流 且 不占页面空间

- 阅读剩余部分 -