如何更改 CSS 语法高亮显示?

发布于 2024-09-05 17:16:56 字数 649 浏览 4 评论 0原文

我在 WordPress.com 上托管了一个博客,并且购买了“自定义 CSS”更新来修改 CSS。现在我想更改 语法突出显示 提供的一些 CSS 选项Wordpress.com。例如,我希望它

   [code lang="C"] int main() { } [/code] 

以黑色背景而不是标准白色背景显示。我已经在 Wordpress.com Appareance > 中添加了修改CSS以下代码:

 .syntaxhighlighter
 {
    background-color: black !important;
 }

如所解释的这里,但它不起作用。 有什么想法吗?

I've a blog hosted on WordPress.com, and i purchased the "Custom CSS" update to modify CSS. Now I want to change some CSS options of Syntax Highlighting provided by Wordpress.com. For example, i want that

   [code lang="C"] int main() { } [/code] 

will be displayed with a black background instead of standard white one. I've added in Wordpress.com Appareance > Modify CSS the following code:

 .syntaxhighlighter
 {
    background-color: black !important;
 }

As explained here, but it doesn't works.
Any idea?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

无声情话 2024-09-12 17:16:56

解决方案不仅要更改整个语法荧光笔的背景,还要更改每行的背景,与此类似:

.syntaxhighlighter
{
    background-color: black !important;
}
.syntaxhighlighter .line .number
{
    color: white !important;
    background-color: black !important;
}
/* First line */
.syntaxhighlighter .line.alt1
{
    background-color: black !important;
}

/* Second line */
.syntaxhighlighter .line.alt2
{
    background-color: black !important;
}

当您使用黑色作为背景颜色时,我建议您确保颜色与其相比具有足够的对比度。

另外,使用 firefox 的 firebug 插件,您可以准确地看到哪个 CSS 规则应用于何处,以及哪些类可用造型。 (在托管系统上工作时必须这样做。)

顺便说一句:我在 您提供的第二个链接

The solution is to not only change the background of the whole syntaxhighlighter, but also of each line, similar to this:

.syntaxhighlighter
{
    background-color: black !important;
}
.syntaxhighlighter .line .number
{
    color: white !important;
    background-color: black !important;
}
/* First line */
.syntaxhighlighter .line.alt1
{
    background-color: black !important;
}

/* Second line */
.syntaxhighlighter .line.alt2
{
    background-color: black !important;
}

As you're using black as a background-color, i advise you to ensure that color has enough contrast compared to it.

Also, using the firebug plugin for firefox you can see exactly which CSS rule gets applied where, and which classes are availble for styling. (a must when working on hosted systems.)

BTW: I found the soluion at the second link you gave

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文