CSS のリセット後にリスト項目が移動するのはなぜですか? 配置を修正するにはどうすればよいですか?

CSS リセット後にリスト項目が移動する: 2 行目を箇条書きで揃える

CSS リセットを採用した後、数人のユーザーが次の問題に遭遇しました。リスト項目内のテキストの 2 行目 (li) は、折り返し後の箇条書きの下で始まります。この視覚的なずれは、li タグの list-style-position プロパティを調整して「外側」に設定することで修正できます。

ただし、この解決策では箇条書きのインデントの問題が発生する可能性があります。これに対処するには、追加の margin プロパティを ul 親要素に適用して、リストの外側のテキストとの位置を確実に揃えることができます。

更新された解決策 (2014 年 3 月 15 日):

ul {
  list-style-position: outside;
  margin-left: 1em;
}

このコードは、前述のインデントの問題に対処し、読みやすさを向上させる、より洗練されたソリューションを提供します。 margin プロパティは ul 要素に適用され、リスト全体がインデントされ、リストの外側のテキストとの適切な位置合わせが維持されます。

以上がCSS のリセット後にリスト項目が移動するのはなぜですか? 配置を修正するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。