ホームページ >ウェブフロントエンド >htmlチュートリアル >HTMLでテキストを中央に配置するコードを記述するにはどうすればよいですか?

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

青灯夜游オリジナル: 2020-04-21 14:52:3447714ブラウズ

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でテキストを中央に配置するコードを記述するにはどうすればよいですか?

line-height プロパティは、テキスト間の距離を設定します。行（行の高さ）。負の値は許可されません。

このプロパティは、ラインボックスのレイアウトに影響します。ブロックレベルの要素に適用すると、その要素内のベースライン間の最大距離ではなく、最小距離が定義されます。

推奨チュートリアル:

html チュートリアル

以上がHTMLでテキストを中央に配置するコードを記述するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

html 对象

声明：

この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

前の記事：HTMLで画像を中央揃えにするにはどうすればよいですか?次の記事：HTMLで画像を中央揃えにするにはどうすればよいですか?

続きを見る