选择未从其父级继承的框css属性。

选择未从其父级继承的框css属性。,css,select,inheritance,Css,Select,Inheritance,select标记似乎没有从其父项继承,这是预期的吗? 在这段简单的代码中,我做错了什么 <!DOCTYPE html> <html lang="en"> <head> <style> form { color:#0000cc; font-size: 10px; } </style>

select标记似乎没有从其父项继承,这是预期的吗? 在这段简单的代码中,我做错了什么

<!DOCTYPE html>
<html lang="en">
    <head>
        <style>
        form
        {
            color:#0000cc;
            font-size: 10px;
        }      
        </style>        
        <title>Select boxes not affected by its css parent propertieses</title>
    </head>

<body>

<form action="#" method="POST">
    <div id="refine_race_search">
    <div><label for="test">my_label</label>
    <select>
        <option value="1">value 1</option>
        <option value="1">value 2</option>
        <option value="1">value 3</option>
        <option value="1">value 4</option>
    </select>
    </div>
    <input type="submit" value="Send"/>
    </div>
</form>
</body>
</html>

表单控件通常不会从其父元素继承CSS属性,因为web浏览器倾向于以默认方式显示表单字段

这样想吧。如果我制作了一个有黄色背景和48px正文的网站,你会期望表单字段也是48px和黄色的吗?是的,在您的特定情况下,这样的表单字段继承将是一件好事;但对于浏览器来说,从用户体验的角度来看,这对网页设计来说并不是一件好事


您应该改为将表单{更改为表单、输入、选择、按钮{,以便接收所需的样式。

是否使用重置样式表?http://meyerweb.com/eric/tools/css/reset/

浏览器为表单元素添加了很多默认样式,因此使用重置样式表可能会有所帮助

也就是说,您可以添加到某些表单元素中的样式数量也有限制,而不会变得相当粗糙