リスト項目の配置に影響を与えずに、順序なしリストを水平方向に中央揃えする方法

順序なしリストのテキスト配置のカスタマイズを実現する

背景:
リストを垂直方向および/または水平方向に配置することは一般的な要件です。垂直方向の配置の制御は比較的簡単ですが、個々のリスト項目の配置に影響を与えずに順序なしリストを水平方向に配置するのは少し難しい場合があります。

課題:
この場合の目標は、これは、リスト項目 (

) の左揃えを維持しながら、幅が不明な順序なしリスト (

) を中央に配置することです。これには、簡単な解決策となる親 div ラッパーの使用は含まれません。

解決策:
'display' プロパティを利用して、順序なしリスト (

)。これにより、リストがテーブルとして設定され、その要素がテーブルのように配置されます。マージンを 0 auto に設定すると、テーブル (したがってリスト) を親コンテナー内で中央に配置できます。

コードの実装:

<code class="css">ul {
  display: table;
  margin: 0 auto;
}</code>

この変更個々のリスト項目の左揃えを維持しながら、順序なしリストを水平方向の中央に配置できます。

以上がリスト項目の配置に影響を与えずに、順序なしリストを水平方向に中央揃えする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。