子元素是否继承父元素特性？CSS移除form-container类后表单样式问题咨询

1. 子元素会继承父元素的CSS属性吗？ #

不是所有CSS属性都会被子元素继承，只有部分属性默认支持继承：

• 文本类：color、font-family、font-size、text-align这类和文字相关的属性
• 列表类：list-style-type、list-style-position这类控制列表样式的属性
• 可见性：visibility属性

而display、position、margin、padding、background这类布局和盒模型相关的属性，默认不会被继承。如果需要强制子元素继承这类属性，可以给子元素设置inherit关键字，比如display: inherit;。

2. 移除form-container类后表单无法恢复列表样式的原因 #

你的代码给.form-container下的form设置了display: flex和flex-direction: column，这会把表单转为弹性布局容器，直接覆盖了表单默认的渲染方式。

移除类后没恢复列表样式，大概率是还有其他CSS规则在影响这个表单：

• 可能存在全局的form{...}样式，给表单设置了display等属性，覆盖了浏览器默认样式
• 打开浏览器开发者工具（按F12），选中表单元素，查看「元素样式」面板里的所有应用规则，找到还在修改display或布局的规则，删掉或者调整优先级即可

如果确实没有其他干扰规则，也可以手动重置表单的默认样式：

form {
  display: block; /* 恢复表单默认的块级显示，内部元素会自动回到垂直排列的列表式布局 */
}

内容的提问来源于stack exchange，提问作者user20943754