縦レイアウトでの文字間隔の使用方法html

Question

日本語の縦型htmlを理解しようとしています。 私の分析の中で私は多くの場所で内容がletter-spacing : <Negative value>であることがわかりました。 私は水平コンテンツではほとんどこのCSSスタイルを使用していませんが、JPではほとんどの場合数字を使用しています。

span.tcy { 
    -webkit-text-combine: horizontal; 
    -epub-text-combine: horizontal; 
    text-combine: horizontal; 
    font-size: 0.9em; 
    line-height: 0.9em; 
    text-indent: 0; 
    letter-spacing: -1px; 
} 

と

.tcy { 
    -webkit-text-combine: horizontal; 
    -epub-text-combine: horizontal; 
    text-combine: horizontal; 
    font-size: 0.9em; 
    line-height: 0.9em; 
    text-indent: 0em; 
    letter-spacing: -1px; 
} 

いずれかは私に文字間隔CSSスタイルの実際のユースケースを説明することができ、なぜそれが形式番号への日本の垂直コンテンツで主に使用されてきました。おかげさまで

Answer 1

letter-spacingプロパティに負の値を使用すると、文字を狭めるだけです。

すべてのフォントには文字の間にスペースがありません。そのため、主にデザイン目的でこのトリックが必要になります。

日本語の垂直コンテンツの場合、「完全な」コンテンツを表示するには、文字間隔プロパティと行高を使用する必要があると思います。

私はあなたにこのリンクを提供しています、これはおそらくあなたを助けるでしょう。スニペットであなたの投稿を編集することをためらっていないと、私はあなたにもっと正確に答えることができます。

https://code.tutsplus.com/tutorials/the-easiest-way-to-create-vertical-text-with-css--net-15284