親 Div を使用せずに順序なしリストを中央に配置するにはどうすればよいですか?

親ラッパーを使用しない順序なしリストの中央揃え

この質問は、親の div 要素。目標は、リスト項目内で左揃えを維持することです (

)。

解決策:

次の CSS コードは、左揃えを維持しながら効果的にリストを中央に配置します。リスト項目の場合:

ul {
  display: table;
  margin: 0 auto;
}

説明:

設定表示: table はリストをテーブルに変換し、利用可能な幅を満たすことができます。 margin: 0 auto プロパティは、テーブル、つまりリストをページ上の中央に自動的に配置します。

例:

<code class="html"><ul>
  <li>56456456</li>
  <li>4564564564564649999999999999999999999999999996</li>
  <li>45645</li>
</ul></code>

結論:

このソリューションは、HTML 内に追加のラッパーを作成せずに、順序なしリストを中央に配置する必要性に対処します。 display: table と margin: 0 の自動プロパティを利用することで、項目の左揃えを維持したまま、リストを水平方向の中央に揃えます。

以上が親 Div を使用せずに順序なしリストを中央に配置するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。