フォントをCSSでより凝縮させる

Question

CSSを使用して文字をもっと近くにすることはありますか？私はラインの高さを調整できることは分かっていますが、フォントをもっと近づけるようなものがあるかどうかはわかりませんでした。あなたはletter-spacing

#id { letter-spacing: -1px; } 

Reference

Answer 1

あなたは

letter-spacing: 0.1em; 

ですべての文字間の距離を指定することはできますが、各文字をラップしない限り、あなたは、個々の文字をカーニングすることはできませんスパンで

Answer 2

を探している

Answer 3

あなたは「フォント」、「凝縮」、および「スクイーズ」の意味に依存します。

font-stretchプロパティを使用して、（フォントファミリの）フォントのより凝縮したタイプフェイス（特定のフォント）を選択できます。しかし、それは何かを絞らない。より凝縮された書体を取り上げるだけです。人々のコンピュータで一般的に利用可能なフォントには、そのような書体はありません。いくつかのダウンロード可能なフォント（Webフォント）があります。そして、特定の書体名をあたかもそれがフォントファミリ名であるかのように使用することで、より多くのクロスブラウザでそれらを使用することができます。 font-family: Arial Narrow。 （注：Arial Narrowは基本的なArialよりはるかに少ないコンピュータでのみ利用できます）

使用するフォントにOpenType形式のカーニング情報がある場合は、特定のCSSテクニックを使用してカーニングを提案できます。 Webページでよく使われるほとんどのフォントには、そのような情報はありません。 （例外：Calibriとカンブリアのようなパラティーノライノタイプ、のTimes New Roman、およびMicrosoft Cフォント）の適切な宣言は：

body { 
text-rendering: optimizeLegibility; 
-webkit-font-feature-settings: "kern"; 
-moz-font-feature-settings: "kern"; 
font-feature-settings: "kern"; 
} 

これらの設定の効果があれば、かなり小さくなる傾向があります。それは実際には、どんなやりとりの意味でも「圧搾」を意味するものではありません。むしろ、タイポグラフィ的に優れているように微妙な方法でレンダリングを変更します。テキストの幅はわずかに小さくなるかもしれませんが、それはちょうど偶然の副産物です。

負の値のletter-spacingを使用している場合、これはブルートの締め付けを意味します。場合によっては意味をなさない場合があります。大きい値のサンセリフテキストの場合は、小さな値がletter-spacing: 0.03emのようになります。それでも、結果を評価する必要があります。特に、絞ったときに奇妙に見える文字の組み合わせに注意してください（例：「rl」または「te」）。そして、文字の間隔が広すぎたり、テキストが広すぎたりしていると思われる場合は、フォントの通常の表示を妨げる​​ことなく、別のフォントの使用を検討してください。