logo标签列表

下拉列表框的CSS属性不会从父级元素继承。

cssselectinheritance
4
<!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>
2个回答
5

表单控件通常不会从其父元素继承CSS属性，因为网络浏览器会以默认方式显示表单字段。

可以这样想。如果我用黄色背景和48px正文字体制作一个网站，你是否希望表单字段也是48px大小和黄色呢？在您特定的情况下，这种表单字段继承可能是一件好事；但对于浏览器来实现它，并不是对于网页设计和用户体验影响都很好的一件事。

相反，您应该改变form{为form, input, select, button{，以便获得所需的样式。

0
你是否使用了重置样式表？（http://meyerweb.com/eric/tools/css/reset/）
浏览器会为表单元素添加许多默认样式，因此使用重置样式表可能会有所帮助。
话虽如此，对于某些表单元素，你可以添加的样式量也是有限的（除非你采用相当hacky的方法）。
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接