HTMLで右揃えを実現する方法-htmlチュートリアル-php.cn

HTMLで右揃えを実現する方法

青灯夜游

リリース： 2023-01-11 09:19:51

オリジナル

71640 人が閲覧しました

HTML で右揃えを実現する方法: 1. タグの align 属性、構文 "" を使用します。 2. タグの style 属性を使用して、右揃えスタイル、構文「< ;element style="text-align:right">」。

HTMLで右揃えを実現する方法

#このチュートリアルの動作環境: Windows 7 システム、CSS3&&HTML5 バージョン、Dell G3 コンピューター。

htmlテキストの右揃え

方法 1: タグの align 属性を使用する

align 属性は、要素内のコンテンツの水平方向の配置を指定します。値を right に設定すると、コンテンツが右揃えになります。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
	</head>
	<body>
		<div>测试文本，测试文本</div>
		<div align="right">测试文本，测试文本</div>
	</body>
</html>

ログイン後にコピー

レンダリング:

HTMLで右揃えを実現する方法

方法 2: タグの style 属性を使用して右揃えのスタイルを追加します

style 属性は、要素のインラインスタイルを指定します。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
	</head>
	<body>
		<div>测试文本，测试文本</div>
		<div style="text-align:right;">测试文本，测试文本</div>
	</body>
</html>

ログイン後にコピー

レンダリング:

HTMLで右揃えを実現する方法

説明:

text-align 属性は、要素内のテキストの水平方向の配置を指定します。。

この属性は、行ボックスが整列する位置を指定することによって、ブロックレベル要素内のテキストの水平方向の整列を設定します。値 justify は、ユーザーエージェントが行コンテンツ内の文字と単語の間の間隔を調整できるようにすることでサポートされており、ユーザーエージェントによって異なる結果が得られる場合があります。

#値left#rightテキストを右に配置します。 centerテキストを中央に配置します。 justifyテキストを両端に揃える効果を実現します。 inherit text-align 属性の値を親要素から継承することを指定します。推奨チュートリアル: 「html ビデオチュートリアル