html - 在一些单词周围添加引号，但仅在复制粘贴时 - 与 q 标签相反

Question

我正在尝试做与 <q> 相反的事情标签。 q 标签在网页中直观地显示引号，但如果您复制粘贴文本，则引号不会出现在粘贴的文本中。我想要相反的东西 - 网页中没有视觉引号，但复制粘贴的文本中存在引号。

为什么？因为有时我更喜欢在我的网页中使用其他视觉样式而不是引号。但是当用户复制文本时，因为我不能依赖他们将文本粘贴到能够保留丰富格式/样式的内容中，所以我希望恢复使用引号，因为它们是简单的 ascii 字符，可以在任何纯文本上下文中使用.

我将举一个具体的例子来帮助阐明。

给定:

.qq { background-color: yellow; }

I am <span class=qq>some quoted</span> text.

当用户查看页面时，他们应该看到:

但是如果他们要复制文本然后将其粘贴到某处，则粘贴的文本将是:

I am "some quoted" text.

仅通过 css 可以吗？我不想使用 js。

我真的不在乎 html/css 需要什么，所以如果引号或 q 标签等需要出现在 html 源代码中而不是 span，那完全没问题。

Answer 1

如果没有 JS，我能想到的唯一方法是将引号放在标记中并使用 CSS 隐藏它们。虽然标记会变得有点困惑。像这样的东西:

.lq,
.rq {
  font-size: 0;
  color: transparent;
}

I am <i class="lq">“</i>some quoted<i class="rq">”</i> text.