ホームページ > ウェブフロントエンド > CSSチュートリアル > CSSで単語を縦書きにする方法

CSSで単語を縦書きにする方法

coldplay.xixi
リリース: 2023-01-03 09:29:42
オリジナル
5173 人が閲覧しました

CSS で縦書きする方法: [writing-mode] を使用してオブジェクトの書き込み方向を設定します。構文は [writing-mode: lr-tb, tb-rl] です。ここで [lr-tb] ] は左から右、上から下、[tb-rl] は上から下、右から左です。

CSSで単語を縦書きにする方法

このチュートリアルの動作環境: Windows7 システム、css3 バージョン、DELL G3 コンピューター。

CSSで縦書きする方法:

<strong>writing-mode</strong>(オブジェクトの書き込み方向を設定する)

構文:

writing-mode : 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>
ログイン後にコピー
効果画像:

CSSで単語を縦書きにする方法

関連チュートリアルの推奨事項:

CSS ビデオ チュートリアル

以上がCSSで単語を縦書きにする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
css
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート