瑞士多语言网站<q>标签引号如何继承html的lang属性设置？

调整CSS选择器，利用:lang()伪类实现继承匹配 #

你当前的CSS选择器q[lang="de-CH"]仅匹配自身带有lang="de-CH"属性的<q>标签，所以没单独加属性的<q>不会生效。要让<q>继承<html>的lang属性样式，改用:lang()伪类即可：

/* 匹配所有处于de-CH语言上下文的q标签 */
:lang(de-CH) q {
  quotes: "«" "»" "‹" "›";
}

/* 如果需要同时支持瑞士法语，可追加 */
:lang(fr-CH) q {
  quotes: "«" "»" "‹" "›";
}

原理说明 #

:lang()伪类会匹配元素自身或其任意祖先元素包含指定语言属性的元素。只要你的<html lang="de-CH">设置正确，页面内所有<q>标签都会自动继承这个语言上下文，无需逐个添加lang属性，Edge浏览器就能正确应用瑞士标准引号。

这个选择器是CSS标准特性，兼容性覆盖所有现代浏览器（包括Edge），完全满足你的需求。

内容的提问来源于stack exchange，提问作者theking2