CSS で水平方向の中央揃えを設定する方法: 1. "text-align: center;" スタイルを使用して、ブロック レベル要素 (親要素) のインライン要素を水平方向に中央揃えにします。 2. "margin: 0 auto" を使用します。 ;" スタイル。ブロック レベル要素 (親要素) 内で固定幅のブロック レベル要素を水平方向に中央揃えにできます。
このチュートリアルの動作環境: Windows 7 システム、CSS3&HTML5 バージョン、Dell G3 コンピューター。
方法 1: text-align 属性を使用する
text-align: center; スタイルを親要素に直接設定すると、次のことができます。ブロックレベルの要素を設定します (親要素) のインライン要素の水平方向の中央揃え
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<style>
#father {
width: 300px;
height: 100px;
background: palevioletred;
text-align: center;
}
</style>
<div id="father">
我是测试文本！
</div>
</html>Rendering:
Description:
このメソッドは、テキスト、画像、ボタン、その他のインライン要素の水平方向の中央揃えにのみ有効です (display 属性は inline または inline-block# に設定されています) ##)
css ビデオ チュートリアル )
方法 2: margin 属性を使用します
中央に配置する必要がある子要素を設定しますmargin: 0 auto; スタイルでは、ブロック レベルの要素 (親要素) 内で固定幅のブロック レベルの要素を水平方向に中央に配置できます。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<style>
#father {
width: 300px;
height: 100px;
background-color: palevioletred;
}
#son {
width: 100px;
height: 50px;
background-color: pink;
margin: 0 auto;
}
</style>
<div id="father">
<div id="son">我是块级元素</div>
</div>
</html>レンダリング: 
プログラミング ビデオをご覧ください。 ！
以上がCSSで水平方向のセンタリングを設定する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
クリップパスでアニメーション化しますApr 19, 2025 am 09:52 AMClip-Pathは、私たちが一般的に知っているCSSプロパティの1つですが、何らかの理由で頻繁に手を伸ばすことはできません。その意味では少し怖いです
GatsbyでGraphQLプレイグラウンドを使用しますApr 19, 2025 am 09:51 AM私はあなたのほとんどがすでにギャツビーについて聞いていると仮定しており、少なくともそれが基本的に反応サイトの静的サイトジェネレーターであることを大まかに知っています。一般的に
タイプまたはテスト：両方ではないのはなぜですか？Apr 19, 2025 am 09:50 AM時々、議論は型付けされたJavaScriptの価値について燃え上がります。 「もっとテストを書くだけです！」対戦相手を叫ぶ。 「ユニットテストをタイプに置き換えてください！」
自分の怠zyなロードを転がすためのヒントApr 19, 2025 am 09:44 AM「怠zyな読み込みを使用できる」と聞いたことがあるかもしれません（または電話を発行しました！特に重いウェブページをスリムにする方法を探しているとき。
CSS 2019調査の3つの予測Apr 19, 2025 am 09:43 AMCSS状態のような開発者調査を実行することは、マルチステージプロセスです。まず、データを収集する必要があります。次に、使用可能な形状に処理します。
最後に...最終的に約束の投稿Apr 19, 2025 am 09:39 AM「JavaScriptの約束で最終的に発砲するのはいつですか？」これは私が最近のワークショップで尋ねられた質問であり、私は何かをクリアするために少し投稿を書くと思いました
ホットAIツール
Undresser.AI Undress
リアルなヌード写真を作成する AI 搭載アプリ
AI Clothes Remover
写真から衣服を削除するオンライン AI ツール。
Undress AI Tool
脱衣画像を無料で
Clothoff.io
AI衣類リムーバー
AI Hentai Generator
AIヘンタイを無料で生成します。
人気の記事
ホットツール
mPDF
mPDF は、UTF-8 でエンコードされた HTML から PDF ファイルを生成できる PHP ライブラリです。オリジナルの作者である Ian Back は、Web サイトから「オンザフライ」で PDF ファイルを出力し、さまざまな言語を処理するために mPDF を作成しました。 HTML2FPDF などのオリジナルのスクリプトよりも遅く、Unicode フォントを使用すると生成されるファイルが大きくなりますが、CSS スタイルなどをサポートし、多くの機能強化が施されています。 RTL (アラビア語とヘブライ語) や CJK (中国語、日本語、韓国語) を含むほぼすべての言語をサポートします。ネストされたブロックレベル要素 (P、DIV など) をサポートします。
SublimeText3 英語版
推奨: Win バージョン、コードプロンプトをサポート!
SublimeText3 中国語版
中国語版、とても使いやすい
Dreamweaver Mac版
ビジュアル Web 開発ツール
VSCode Windows 64 ビットのダウンロード
Microsoft によって発売された無料で強力な IDE エディター
