HTMLでテキストを中央に配置するコードを記述するにはどうすればよいですか?-htmlチュートリアル-php.cn

HTMLでテキストを中央に配置するコードを記述するにはどうすればよいですか?

青灯夜游

リリース： 2020-05-12 18:16:39

オリジナル

47705 人が閲覧しました

HTML でテキストを中央揃えにするコードを記述するにはどうすればよいですか?次の記事で紹介します。一定の参考値があるので、困っている友達が参考になれば幸いです。

HTMLでテキストを中央に配置するコードを記述するにはどうすればよいですか?

#テキストは水平方向に中央揃えです

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>水平居中</title>
		<style>
			.box {
				width: 300px;
				height: 200px;
				background: palegoldenrod;
				text-align:center;
			}
		</style>
	</head>
	<body>
		<div class="box">水平居中了--文本文字</div>
	</body>

</html>

ログイン後にコピー

レンダリング:

HTMLでテキストを中央に配置するコードを記述するにはどうすればよいですか?

手順 : text-align

text-align は、要素内のテキスト行をどのように配置するかに影響を与える基本的な属性です。 left、right、center の値を指定すると、要素内のテキストがそれぞれ左揃え、右揃え、中央揃えになります。テキストを中央揃えにしたい場合は、center を使用してください。

この属性は、text タグや img タグなどの一部のインラインオブジェクト (または同様の要素) の中央揃えを設定します。

テキストは垂直方向の中央に配置されます

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>垂直居中</title>
		<style>
			.box {
				width: 300px;
				height: 300px;
				background: paleturquoise;
				line-height:300px;
			}
		</style>
	</head>
	<body>
		<div class="box">垂直居中了--文本文字</div>
	</body>
</html>

ログイン後にコピー

レンダリング:

HTMLでテキストを中央に配置するコードを記述するにはどうすればよいですか?