Question

我正在日本网站上工作，我正在使用Meiryo webfont。我真的很喜欢这种字体，但特殊字符有太多的余量。确切的问题是，在像@这样的特殊字符前面有太多的空间，如果这样的字符是第一个就行了，这会使设计看起来很容易。

font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;

<h3>【好き】</h3>
<p>猫、アクリル板、真空管、リンゴジュース、ゾロ目、柄物、ドラッグストア、レゴ、アイドル、アニメ、光る物、製菓、イラスト、ドラム(叩けない)、ダリ</p>
<h3>【好きくない】</h3>
<p>煙草、カフェイン、満員電車及び人混み、パンチのあるアルコール類、刺激物全般(辛い、苦い)、算数、スポーツ全般、読書、プンプンしてる人</p>
<h3>【弱点】</h3>
<p>近眼乱視、虚弱、猫舌、譜面が読めない、書けない。方向音痴、機械音痴、運動音痴。睡眠をとらないと死ぬ。強く怒られると死ぬ。</p>

我浏览器中的问题图片： http://i.stack.imgur.com/OYqMt.jpg

我解决这个问题的想法是编写一个脚本，将每个特殊字符放在一个具有负边距的容器中。这显然是非常hacky，根本不实用，所以有没有更好的解决方案，只有特殊字符的不同字体？

Answer 1

我不会说这是一个很好的选择，但你可以让CSS渲染透镜支架。通过这样做，你完全从文本中删除括号，因此它们不再是可选择的，可索引的等等，但是它可以用简单的CSS类解决这些字符的填充问题，它应该适用于任何元素。

这只适用于这两个字符。其他特殊字符需要类似的CSS规则。

.brackets:before {
    content:'\3010';
    margin-left:-1.5%;
}
.brackets:after {
    content:'\3011';
    margin-right:-1.5%;
}

然后在HTML中，只需添加一个括号类并删除文本中的括号：

<h3 class="brackets">好き</h3>

.brackets:before {
    content:'\3010';
    margin-left:-1.5%;
}
.brackets:after {
    content:'\3011';
    margin-right:-1.5%;
}

<h3 class="brackets">好き</h3>
<p>猫、アクリル板、真空管、リンゴジュース、ゾロ目、柄物、ドラッグストア、レゴ、アイドル、アニメ、光る物、製菓、イラスト、ドラム(叩けない)、ダリ</p>
<h3 class="brackets">好きくない</h3>
<p>煙草、カフェイン、満員電車及び人混み、パンチのあるアルコール類、刺激物全般(辛い、苦い)、算数、スポーツ全般、読書、<span class="brackets">プンプンしてる人</span></p>
<h3 class="brackets">弱点</h3>
<p>近眼乱視、虚弱、猫舌、譜面が読めない、書けない。方向音痴、機械音痴、運動音痴。睡眠をとらないと死ぬ。強く怒られると死ぬ。</p>

日语特殊字符的不同webfont

1 个答案: