CSS说项目符号文本是黑色的;我如何使用HTML使其成为某些网页的另一种颜色



我们网站的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>

在这个例子中,你可以决定是否只改变这个链接的样式,或者这个列表中的所有链接,或者所有列表中的所有链接,或者任何其他组合。

仅更改此链接

为该链接添加一个类,以标识它是一种特殊类型的链接:

<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>

把颜色改成你想要的。

相关内容

最新更新