3

我正在尝试找到以下问题的解决方案，如果有的话。

假设主引号是双引号“（开始）和”（结束）。假设第二个引号是一个单引号'（开始）和'（结束）。

想想报价中的报价是如何显示的。

写引号的标准当然是交替的，像这样。

“双'单'双'单'双'单'双。”</p>

现在，在 HTML 中，你可以这样写：

<q>Double <q>single <q>double <q>single </q>double </q>single </q>double.</q>

但是不，如果不应用 CSS 规则，这是行不通的。我不会在这里使用 :lang 伪选择器，所以我只是不使用它。

q:before,
q q q:before,
q q q q q:before { content: '“' }

q:after,
q q q:after,
q q q q q:after { content: '”' }

q q:before,
q q q q:before,
q q q q q q:before { content: '‘' }

q q:after,
q q q q:after,
q q q q q q:after { content: '’' }

你知道这是怎么回事，对吧？qs 累加起来。

所以现在有两个选择：要么我没有看到以正确顺序选择 q 元素的合乎逻辑的方式，要么就是不可能。

PS：我知道在引用中引用引用中引用引用是非常理论的。

4

3 回答 3

2

CSS2.1 具有专门为处理引号而设计的功能。特别是该quotes属性对嵌套有基本的支持，但它只能支持任意深度的嵌套，而不支持递归或重复嵌套。

因此，虽然目前还没有涵盖所有嵌套级别的 CSS 解决方案，但您可以根据需要尽可能深地指定引号，同时从选择器中的硬编码嵌套元素:before和:after伪元素中节省相当多的字节：

q { quotes: '“' '”' '‘' '’' '“' '”' '‘' '’' '“' '”' '‘' '’' '“' '”' '‘' '’'; }

/* 
 * These should already be in the default UA stylesheet per HTML specs
 * so you should not have to include them, but some older browsers may forget.
 */
q:before { content: open-quote; }
q:after { content: close-quote; }

您无需担心浏览器支持，因为 HTMLq元素和 CSSquotes属性与 for:before和:after.

目前还没有任何 CSS3 模块在积极开发中通过报价生成来解决这个问题，但希望我们很快就会看到一些东西。

于 2012-11-19T05:17:40.363 回答
2

没有办法编写一个规则来捕获第 1、第 3、第 5 等与第 2、第 4、第 6 层相同的嵌套元素，递归地用于任何n层。

除了理论问题之外，您还必须设置类和/或使用 javascript。

于 2012-11-18T21:39:53.493 回答
2

我不能让它只与 CSS 选择器一起工作nth-child(odd)，nth-child(even)因为它们是嵌套的，但使用 jQuery 是可能的：

首先定义你的 CSS 类：

.e:before {content:'“'}
.o:before {content:'‘'}
.e:after {content:'”'}
.o:after {content:'’'}

然后使用 jQuery 将类添加到每个偶数/奇数引号中：

$("q:odd").addClass('o');
$("q:even").addClass('e');

演示

相关问题：

于 2012-11-18T21:40:53.300 回答