我想使用css为我的所有边框设置全局默认大小和颜色。我有一个问题,我尝试使用它时,我的css设置默认边框宽度和颜色被覆盖。基本上我有这样的事情:
My.css
* {
border-width: 1px;
border-color: #222;
}
#streak {
border-bottom: solid;
}
My.html
<html>
<div id="streak">
WOOOOOOOO!
</div>
</html>
问题在于,当我将底部边框设置为实线时,默认宽度为3px,颜色为黑色。在开发者控制台中,它显示应用了* {...}的css,但随后它被划掉,现在它的初始宽度和颜色是从“border-bottom:solid; “规则。
我发现,如果我在* {...} css规则中使用!important,它会起作用,但我真的不喜欢使用!如果我不需要那么重要。< / p>
有更好的方法吗?
答案 0 :(得分:4)
您使用*
规则做的事情很好。您要对单个元素执行的操作设置为边框样式。您需要使用border-style
组件属性,而不是border
简写,因为速记将覆盖宽度和颜色及其初始值(medium
和{{1分别):
currentColor
当然,这意味着您可以在做希望用其他值覆盖全局宽度和颜色的情况下继续使用速记。
答案 1 :(得分:-1)
你的css文件和类一切正确。你错过了“border:solid”这一行的边框样式。没有给出类型它将无法正常工作。现在你可以试试这个。
* {
border-width: 1px;
border-color: #222;
border:solid
}
<html>
<head>
<link rel="stylesheet" type="text/css" href="example.css" />
</head>
<div>
WOOOOOOOO!
</div>
<span> hiiiiiiiiiiiiiiiii </span>
</html>