CSSテキストを縦方向に配置する4つの方法

ウェブページの特定の領域にテキストを垂直方向または水平方向に配置する必要がある場合があります。もちろん、垂直方向の配置については、しばらくアイデアが見つかりません。実際には水平方向の配置と同じくらい簡単です。 CSS テキストを垂直方向に配置する 4 つの方法を紹介します。

1つ目の方法：spanに縦に表示したい文字を入れて、CSSでspanの表示属性をblockに設定する ただし、この方法は少し面倒なので非推奨です。 :

h1 span { display: block; }   N   E   T   T   U   T   S

2番目の方法A: 縦方向の表示が必要な場合は、CSSも使用して、文字が自動的に縦方向に配置されるように、表示領域の幅を強制的に定義します: 具体的なコードを参照してください:

    Vertical Text     NETTUTS

2番目の方法B: CSS も使用します。この方法は互換性が高く、コードが簡潔で、文字を制御しやすいと思います。

   竖向排列的文字    我爱北京天安门

3 番目の方法: JavaScript を使用します (推奨されません。実際、このような小さな関数に JS を使用するのは費用対効果が高くありません。結局のところ、これより効果的で簡潔な方法があります)

    Vertical Text     NETTUTS  ’ + h1.innerHTML.split(”).join(‘’) + ‘’; " _ue_custom_node_="true">