我们网站的CSS规定项目符号文本应该以黑色显示。我如何使用HTML使它成为某些网页的另一种颜色?我试着编码html,但不能渲染黑色以外的颜色。
<ul>
<li><span style="line-height: 1.714285714;"><a href="URL" target="_blank">Log in to the portal</a>.</span></li>
</ul>
你可以创建一个这样的样式来改变列表项的颜色:
ul.colorlist li a {
color:red;
}
可以放置在外部或嵌入式CSS中,并将专门更改类所应用的列表中链接的颜色(示例代码中显示了链接)。如果您只想更改列表中的文本:
ul.colorlist li {
color:red;
}
无论哪种方式,您都可以像这样将类应用于列表:
<ul class="colorlist">
一个快速而肮脏的方法:内联样式
CSS定义的样式将被HTML元素的内联样式属性覆盖。
<li>
<!-- Wrap the text in a span and add a style attribute (just like @Sifu's answer) -->
<span style="color: red;">some text</span>
</li>
但是更有可能的是,示例中为文本着色的CSS来自a
(链接)标记。如果你想使用内联样式,你可以在链接本身添加style属性。
<li>
<!-- I've omitted the span's style attribute for these examples. -->
<span><a style="color: red;">some text</a></span>
</li>
如果你可以编辑HTML,但不能编辑CSS,那么这可能是你唯一的选择,但除非你没有其他选择,有一个更好的方法…
更好的方法
如果你可以编辑/添加网站的CSS,那么最好的做法是改变这些HTML元素的颜色。
有许多方法可以编写CSS选择器来针对HTML元素,这不仅取决于可用的内容,还取决于设计者在编写时的心情。
css开始a { color: blue; }
li { color: black; }
开始html <li><span><a href="#">text</a></span></li>
a { color: blue; }
li { color: black; }
<li><span><a href="#">text</a></span></li>
在这个例子中,你可以决定是否只改变这个链接的样式,或者这个列表中的所有链接,或者所有列表中的所有链接,或者任何其他组合。
仅更改此链接
为该链接添加一个类,以标识它是一种特殊类型的链接:
<li><span><a href="#" class="myfancykindoflink">text</a></span></li>
为这个类添加一个CSS选择器:
/* in CSS a class selector is more specific than a type selector
* so this overrides the `a` style specified above.
*/
.myfancykindoflink { color: red; }
更改此列表中的所有链接
添加一个类到该列表,以标识它是一种特殊类型的列表:
<ul class="myfancykindoflist">
<li><span><a href="#">text</a></span></li>
</ul>
为该类中的链接添加一个CSS选择器:
.myfancykindoflist a { color: red; }
这个呢:(Inline style)
<li>
<span style="line-height: 1.714285714; color: red;">
<a href="URL" target="_blank">Log in to the portal</a>.
</span>
</li>
把颜色改成你想要的。