前端知识速记 - CSS篇：可继承属性与不可继承属性

可继承属性

特点：

1. 文本相关性：大多数可继承属性与文本样式相关，用于定义文本的外观。比如 color、font-family 和 font-size 等。

2. 结构简化：通过继承父元素的样式，可以减少子元素上的样式设置，从而保持样式结构的简洁性。

3. 适用于层级嵌套：当我们在一个文档中有多个嵌套的元素时，可继承属性能够有效地为整个树形结构提供一致性。

不可继承属性

特点：

1. 布局相关性：大多数不可继承属性与元素的布局、尺寸和外观相关，如 margin、padding 等，不同的元素通常有不同的布局需求。

2. 元素独立性：这些属性要求子元素根据自身需求独立定义，不会自动延续父元素的样式，这可以避免不必要的样式干扰。

3. 特定样式需求：不可继承属性更倾向于特定视图或参数的设置，确保元素在外观和行为上能够具备独特性。

---

继承类型	属性名称	描述
可继承属性	color	设置文本颜色。子元素将继承父元素的文本颜色。
	font-family	设置字体族。子元素将使用父元素指定的字体族。如果没有指定，浏览器将使用默认字体。
	font-size	设置字体大小。子元素会继承父元素定义的字体大小，除非在子元素上重新定义。
	line-height	设置行高。强烈推荐使用相对单位，确保子元素行高继承父元素定义的规格。
	text-align	设置文本对齐方式。子元素在没有特定指定时，将继承父元素的对齐属性。
	text-indent	设置文本缩进。子元素继承文本缩进属性。
	visibility	设置元素的可见性。子元素会继承父元素的可见状态。
	white-space	设置空白处理方式。影响子元素如何处理空白字符。
	border-collapse	设置表格是否合并边框。用于表格时，子元素会继承父元素的此属性。
	list-style	设置列表项的样式。子元素列表会继承父元素的样式设置。
不可继承属性	margin	设置外边距。子元素不会继承父元素的外边距属性。
	padding	设置内边距。内边距属性不会被子元素继承。
	border	定义元素边框。子元素不会自动继承父元素的边框样式。
	height	设置元素高度。子元素将独立定义自己的高度，无法继承父元素高度。
	width	设置元素宽度。子元素的宽度须自身定义，不会受父元素控制。
	display	控制元素的显示类型（如block、inline等）。此属性不会被子元素继承。
	position	设定元素的定位方式（如static、relative等）。子元素会根据自身规则定位。
	background	设置背景样式。子元素不会继承父元素的背景属性，且可以独立设置自己的背景。
	overflow	决定元素如何处理溢出内容。此属性不会被子元素继承。
	box-shadow	设置元素的阴影效果。且子元素不会继承父元素的阴影样式。