ホームページ >ウェブフロントエンド >htmlチュートリアル >HTMLのcenter属性とは何ですか? HTMLテキストと画像の中央揃えについて解説（例付き）
HTMLのcenter属性とは何ですか? HTMLテキストと画像の中央揃えについて解説（例付き）
- 寻∝梦オリジナル
- 2018-09-03 17:07:2210933ブラウズ
この記事では、HTML の align 属性を紹介し、また、align 属性がテキストを中央に配置する方法と、HTML の align 属性が画像を中央に配置する方法についても紹介します
1。 . まず、HTML の centering 属性について説明します:
今日は、align 属性を使用することをお勧めします。この記事では、主に align プロパティのテキストと画像の使用方法を紹介します。次に、テキストを中央に配置するための HTML align 属性について話しましょう。完全なコードを見てみましょう:
<!doctype html> <html> <head> <meta charset="utf-8"> <title>PHP中文网</title> </head> <body> 这是一段文字，没有任何的标签，看看我现在在哪 </body> </html>これは簡単なコードで、表示効果は図に示すとおりです:
今度は上のテキストを中央に配置したいのですが、どうすればよいでしょうか?
はい、記事の冒頭で紹介した align 属性です。 align 属性を追加します。 それでは、コードを見てみましょう:<!doctype html> <html> <head> <meta charset="utf-8"> <title>PHP中文网</title> </head> <body> <p align="center">这是一段文字，没有任何的标签，看看我现在在哪</p> </body> </html>テキスト ラベルは元々段落 p タグによって要約されているため、ここでは p タグを使用し、center に等しい align 属性を追加します。つまり、p タグ内のすべてのテキストが中央に表示されます。エフェクトのスクリーンショットを見てみましょう:
HTML オンライン ビデオ チュートリアルをご覧ください)
次に、align 属性を使用して画像を中央に配置する方法を見てみましょう:
画像タグが<!doctype html> <html> <head> <meta charset="utf-8"> <title>PHP中文网</title> </head> <body> <p align="center">这是一段文字，没有任何的标签，看看我现在在哪</p> <img src="https://img.php.cn/upload/article/000/000/003/5b49b1f76ccb9475.jpg" alt="HTMLのcenter属性とは何ですか? HTMLテキストと画像の中央揃えについて解説（例付き）" > </body> </html>上記のコードにネットワーク イメージを追加し、その効果を見てみましょう:
<body> <p align="center">这是一段文字，没有任何的标签，看看我现在在哪</p> <img src="https://img.php.cn/upload/article/000/000/003/5b49b1f76ccb9475.jpg" align="middle" alt="HTMLのcenter属性とは何ですか? HTMLテキストと画像の中央揃えについて解説（例付き）" > </body>上記で align 属性を追加しました。もちろん、これは html4.01 でのみ使用できます。なのでここでは写真は載せません。誰もが理解できる範囲で。 この記事の HTML の align 属性の紹介はここで終わります。ご質問がある場合は、以下にメッセージを残してください。 【編集者のおすすめ】
HTMLのtbodyタグはブロックレベルの要素ですか？ HTMLのtbodyタグの基本的な使い方
HTMLに画像を追加するコードとは？ HTMLに画像パスを正しく追加するにはどうすればよいですか?
以上がHTMLのcenter属性とは何ですか? HTMLテキストと画像の中央揃えについて解説（例付き）の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。