我想用CSS改变我的hr标签的颜色。我尝试了下面的代码似乎不工作:
hr {
color: #123455;
}
我想用CSS改变我的hr标签的颜色。我尝试了下面的代码似乎不工作:
hr {
color: #123455;
}
当前回答
因为我没有声誉来评论,我将在这里给出一些想法。
如果你想要一个可变高度的CSS,去掉所有的边框,并给出一个背景色。
hr{
height:2px;
border:0px;
background:green;
margin:0px;/*sometimes useful*/
}
/*Doesn't work in ie7 and below and in Quirks Mode*/
if you want simply a style that you know that will work (example: to replace a border in a ::before element for most email clients or hr{ height:0px; border:0px; border-top:2px solid blue; margin:0px;/*useful sometimes*/ } In both ways, if you set a width, it will always have it's size. No need to set display:block; for this. To be totally safe, you can mix both, 'cause some browsers can get confused with height:0px;: hr{ height:1px; border:0px; background:blue; border-top:1px solid blue; margin:0px;/*useful sometimes*/ } With this method you can be sure that it will have at least 2px in height. It's a line more, but safety is safety. This is the method you should use to be compatible with almost everything. Remember: Gmail only detects inline css and some email clients may not support backgrounds or borders. If one fails, you will still have a 1px line. Better than nothing. In the worst cases, you can try to add color:blue;. In the worst of the worst cases, you can try to use a <font color="blue"></font> tag and put your precious <hr/> tag inside it. It will inherit the <font></font> tag color. With this method, you WILL want to do like this: <hr width="50" align="left"/>. Example: <span> awhieugfrafgtgtfhjjygfjyjg <font color="#42B3E5"><hr width="50" align="left"/></font> </span> <!--Doesn't work in ie7 and below and in Quirks Mode--> Here is a link for you to check: http://jsfiddle.net/sna2D/
其他回答
这将保持水平规则1px厚,同时改变它的颜色:
hr {
height: 0;
border: 0;
border-top: 1px solid #083972;
}
代码适用于旧的IE 尝试了很多颜色 <人力资源颜色=“黑色”> <人力资源颜色= "蓝色" >
我在2015年5月的IE, Firefox和Chrome上进行测试,这在当前版本中效果最好。它将HR居中,并使其70%宽:
人力资源。光{ 宽度:70%; 保证金:0汽车; 边框:0px无白色; Border-top:1px纯浅灰色; } <hr class="light" />
你可以像这样添加引导bg类
<hr class="bg-light" />
我认为这是最有效的方法:
<hr style="border-top: 1px solid #ccc; background: transparent;">
或者如果你喜欢在所有的hr元素上写这个CSS:
hr {
background-color: transparent;
border-top: 1px solid #ccc;
}