选定引用的背景颜色

你好!
请告诉我一段 CSS 代码示例,用于设置引用中选定文本部分的背景颜色。
这是示例:

在我的网站上,引用的高亮部分没有背景,我尝试自己调整 CSS 但没有成功 :pensive:

你好,

你可以通过以下指南轻松找到答案:

这将在未来帮助你。

关于你所问的内容,更改此特定部分的 CSS 代码如下。将默认值替换为你想要的任何颜色。:slight_smile:

.cooked span.highlighted {
    background-color: var(--tertiary-low);
}

我添加了 .cooked 选择器,因为我认为 span.highlighted 在论坛的其他部分也有使用。

1 个赞

你好 @Canapin :wave:,是的,我读了这篇文章,但写得有点肤浅。我已经尝试粘贴了像您的代码,但它只影响了第一个引用,后面的引用背景颜色没有改变。

@Aizada_M 我不确定这是否有帮助,但你可以使用这个……

它会在编辑器中给你一个按钮,用不同的颜色和背景色来装饰选定的文本……它在编辑器中生成的代码看起来像这样……

[wrap=yellow color=green bgcolor=red]
[quote="system, post:1, topic:3, full:true"]在此处创建不属于任何现有类别的帖子。[/quote]
[/wrap]

[wrap=yellow color=green bgcolor=red]在此处创建不属于任何现有类别的帖子。[/wrap]

(不确定“wrap=color”有什么作用)


如果你想为你的网站上的所有引用块设置背景颜色,可以使用这个 CSS……

aside.quote .title,
blockquote {
background-color: yellow;
}
2 个赞

也许我误解了你的要求?

因为我的 CSS 对多个引用都有效:

1 个赞

你理解得没错,但不知为何,只有第一个引用有颜色,后面的就没有了 :man_shrugging:

您的其他引用中默认有高亮部分吗?
您能像在第一个帖子中那样录制一个视频吗? :slight_smile:

1 个赞

感谢您的回答 :raised_hands:,您分享了非常有用的信息,我已将您的代码保存以备将来使用,但我需要引用的文本的背景在引用时能从一般背景中脱颖而出。

在正常的折叠状态下,引用的背景不会突出显示。单击 :arrow_down_small: 按钮后,整个文本会展开,其中只有引用的部分的背景会以不同的颜色突出显示。
例如像这样:

扩展引用的类型:

1 个赞

是的,我高亮了每个引用,但不知何故,只有第一个引用的选中文本背景发生了变化。明天我会录制一个视频并在此处发布。

你好!
这是我粘贴到主题 CSS 中的代码:

.cooked span.highlighted {
    background-color: var(--tertiary-low);
}

这是它的工作原理:

我明白了。

引用的项目符号列表有点混乱:

在你的第一个引用中,你只引用了项目符号的文本。

在第二个引用中,你选择了项目符号,它在显示整个引用时被修改了。项目符号会比它原来的缩进级别高一级,并且与原来的引用不匹配,所以没有高亮显示。

这与我的 CSS 无关。无论如何你都得不到高亮显示。:slight_smile:

2 个赞

谢谢 :raised_hands:!据我所知,这个问题没有解决方案。:pensive:

是的,没有,我甚至不确定修复我链接的#bug是否能解决这个特定问题。

1 个赞