コミュニティ 学ぶ ツールライブラリ レジャー
検索
日本語
ホームページ > ウェブフロントエンド > htmlチュートリアル > この場合、div を中央に配置するにはどうすればよいですか?_html/css_WEB-ITnose

この場合、div を中央に配置するにはどうすればよいですか?_html/css_WEB-ITnose

WBOY
リリース： 2016-06-24 12:10:42
オリジナル
1207 人が閲覧しました

私のページはおおよそ次のとおりです:



つまり、実際のページは次のようになります。最終的にタグは次のとおりです。


  • ...
    • li>..

  • これらの div のスタイルを ul 全体の中央に設定するにはどうすればよいですか?中央揃えのスタイルを使用する必要がある理由は次のとおりです。どのサイズの画面でも中央に表示したいので、そうしないと要素の間隔を調整するだけで画面サイズが変わってしまい、軌道から外れてしまいます

    アドバイスお願いします~~~~






    ディスカッションへの返信 (解決策)

    ul の下にネストされた div 要素は、XHTML 仕様に準拠していません。 ul はブロックレベルの要素で、固定幅の値を設定した後、margin:0 auto; スタイルによって中央に配置できます。異なるスタイルを設定するためにリスト項目を「グループ化」する必要がある場合は、次のような異なるスタイル クラスを追加することで実行できます。また、ul: text-align でスタイルを設定することによって効果を確認することもできます。 ：中心 。 。 。 。

    しかし、text-align はテキストに対してのみ機能するようです

    最終的に、問題は 1 行 4 列を要求したので、各行に 4 つの div を作成し、幅を 25% に設定しました。
  • を内側に配置し、margin:auto を設定します

関連ラベル：
这种情况如何让div居中?
ソース：php.cn
前の記事：バグ、解決できません。ブレーンストームアイデア。 _html/css_WEB-ITnose 次の記事：
    リストの前に数字がないのはなぜですか?アドバイスをお願いします、ありがとうございます。ソースコード_html/css_WEB-ITnose
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
最新の問題
固定配置された子によって親のパディングが無視される スティッキー要素がヘッダーの後ろに来るのを防ぐにはどうすればよいですか?現在のコードスニペットは親にpadding-topを使用しており、追加の子にmargin-topまたは透明な...
から 2024-04-06 11:42:51
0
1
338
ノードサーバーは React アプリケーションをホストできますか? 私はバックエンドのコーディングが初めてなので、「フルスタック」アプリケーションがどのようなものかを理解するのに苦労しています。これは当てはまりますか: <scriptsrc=...
から 2024-04-04 14:32:25
0
1
389
クリックしたときにテキストが新しい要素 (区切り線など) に変わるようにするにはどうすればよいですか? ページ上の特定のテキストをクリックすると区切り文字/新しい要素に変わる方法を見つけようとしています。どう説明したらいいのかわかりませんが、画像の下にタイトルがあると想像してください...
から 2024-04-04 11:21:03
0
1
3580
関連トピック
詳細>
人気のおすすめ
人気のチュートリアル
詳細>
関連するチュートリアル
人気のおすすめ
最新のコース
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート