ホームページ > 記事 > ウェブフロントエンド > CSSでdivテキストを縦書きにする方法
CSSでdivテキストを縦書きにする方法
- 藏色散人オリジナル
- 2021-02-23 14:59:306226ブラウズ
CSS で div テキストを縦書きにする方法: 最初に HTML サンプル ファイルを作成し、次に div を作成し、最後に CSS スタイルを "div{writing-mode: tb-rl;}" に設定します。 div テキストは縦書きです。
この記事の動作環境: Windows7 システム、HTML5&&CSS3、Dell G3 コンピューター。
CSS でテキストを縦方向に配置する設定方法:
1. 書き込みモード (オブジェクトの書き込み方向の設定)
構文: 書き込みモード: lr-tb、tb-rl
パラメータ: lr-tb: 左から右、上から下 tb-rl: 上から下、右から左
例:
css コード:
div { writing-mode: tb-rl; }例:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>竖列排版实例</title>
<style>
div { writing-mode: tb-rl; }
</style>
</head>
<body>
<div>我是竖列排版</div>
</body>
</html>レンダリング:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>竖列排版实例</title>
<style>
body{text-align:center}
.shuli{ margin:0 auto;width:20px;line-height:24px;border:1px solid #333}
</style>
</head>
<body>
<div class="shuli">我是竖列排版</div>
</body>
</html>レンダリング:
css ビデオ チュートリアル 」
以上がCSSでdivテキストを縦書きにする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。