当字体为宋体时，着重号过粗

[0xashu]

[0xashu]

起初，我以为是宋体自身的问题，后来采取以下方案：

em {
  position: relative;
}

em:after {
  position: absolute;
  top: 0.65em;
  left: 0;
  width: 100%;
  font-family: sans-serif; // 设为黑体
  overflow: hidden;
  white-space: nowrap;
  content: "・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・";
}

结果，着重号依然过粗。

[ethantw]

請使用相應的標點字體，如下：

// 無襯線字體
.sans {
  font-family: 'Biaodian Sans', sans-serif;
}

// 襯線字體
.serif {
  font-family: 'Biaodian Serif', serif; 
}

// 不支援`text-emphasis`及`unicode-range`的瀏覽器
.no-textemphasis em:lang(zh) h-char:after,
.no-textemphasis em:lang(ja) h-char:after {
  font-family: Georgia, 'Time New Roman', Arial, serif !important;
}

詳細中文標點字體列表請見： https://css.hanzi.co/manual/wenzisheji#biaodian_yangshi_xiuzheng-zhongwen_biaodian_liebiao

[ethantw]

@Aaaaaashu: 不曉得是否還有問題？歡迎指教。 :smiley_cat:

[0xashu]

哈，我可以请教一下，导致着重号变粗的原因是什么吗？ 多谢指点。

[ethantw]

中文著重號缺省為U+25CF BLACK CIRCLE 1，該字符在各個字體中的尺寸不一，導致「著重號過粗」，故需要對該字符指定字體方能正常顯示 3。

P.S. 目前text-emphasis屬性只為WebKit所支援，其他瀏覽器上則以JavaScript搭配偽元素實現 4。