CSSで狭い文字を作成する

Question

CSSでArial風のフォントの文字幅を縮小するにはどうすればよいですか？

Answer 1

文字幅を減らすことはできませんが、文字間隔を減らすことはできます。

span {
 letter-spacing: 0px;
}

Answer 2

フォントファミリ宣言で狭いフォントを使用します。これらはかなり一般的です。

font-family: "Helvetica Narrow","Arial Narrow",Tahoma,Arial,Helvetica,sans-serif;

Answer 3

CSS 3の font-stretchプロパティ を使用すると、フォントのストレッチが可能になります。

Answer 4

テキストを拡大縮小できます。例えば：

.my-text {
    transform: scaleX(0.5);
}

ただし、transform-Originテキストを他の場所に移動させることができます（たとえば、Originを中心に拡大縮小する場合）。

Answer 5

このためにCSSコードでfont-weight:を使用できます

Answer 6

font-stretch CSS property を使用してみてください：

font-stretch: condensed;

ブラウザのサポートは制限されているようです。 このもう1つの答え へのコメントですが、Firefox 61でうまくいきました。