为什么CSS样式不能被HTML表单字段继承？

我想在我的HTML文档中设置文本的字体样式和字体大小。为什么CSS样式不能被HTML表单字段继承？

<html> 
<head> 
    <title>Style inheritance</title> 
    <style type="text/css"> 
    <!-- 
    body { 
      background-color: #000000; 
      font-family: sans-serif; 
      color: #EEEEEE; 
      margin: 0; 
      font-size: 22pt; 
    } 
    --> 
    </style> 

</head> 
<body> 
    test text 
    <form> 
     <input type="text"> 
    </form> 
</body> 
</html>

我曾经了解到，每个HTML元素都会继承其父元素的样式属性。在我的情况下，body的所有子元素的尺寸应该为22pt。

但是，为什么这不适用于input,select, textarea等？

来源

2012-06-28 R_User

input，select，textarea - 他们不默认继承，但是你可以设置它与CSS继承

input, select, textarea {font-family: inherit;}

现场演示：http://jsfiddle.net/rvjKE/

来源

2012-06-28 17:54:47

也许应该在该列表中添加'button' ... http://jsfiddle.net/rvjKE/7/ –

是@ MatthewT.Baker。 '：）' –

-3

可以使用form CSS选择风格你输入

form{ 
    font-family: sans-serif; 
    color: #EEEEEE; 
    font-size: 22pt; 
}

来源

2012-06-28 17:56:17 Amaerth

还是不行的哥们！他们不会继承！ –

这不起作用 –

这是因为它们是默认的用户界面元素采取用户操作系统的外观和感觉。至少，他们曾经这样做过。现在不同的浏览器使用不同的默认样式，但它们通常倾向于非常相似。

无论如何，这个想法是让网站所有者修改外观左右左右的界面元素，同时仍然保持用户对输入元素的默认外观。强制你单独更改样式是唯一的方法。

来源

2012-06-28 17:56:40 animuson

仅当没有样式表设置该元素的属性时（或者已设置值inherit）时，元素才会继承属性。表单字段通常在浏览器样式表中为它们设置。

所以你需要明确地设置它们的属性来覆盖浏览器的默认值。如果您希望所有元素具有某些属性，例如，您可以使用通用选择器*执行此操作。

* { font: 100% Calibri, sans-serif; }

需要时您可以轻松地覆盖这个特定的元素，因为通用选择具有非常低的特异性。

来源

2012-06-28 19:02:32

为什么CSS样式不能被HTML表单字段继承？

回答

相关问题