ホームページ  >  記事  >  ウェブフロントエンド  >  CSS セレクターを使用して、入れ子になった並べ替え可能なリスト内の直接の子のみをターゲットにする方法

CSS セレクターを使用して、入れ子になった並べ替え可能なリスト内の直接の子のみをターゲットにする方法

Mary-Kate Olsen
Mary-Kate Olsenオリジナル
2024-11-23 06:22:16716ブラウズ

How to Target Only Immediate Children in a Nested Sortable List with CSS Selectors?

CSS セレクターを使用して直接の子をターゲットにする

ネストされた並べ替え可能なリストでは、直接の子のみをターゲットにするのは難しい場合があります。 「ul > li」や「#parent > li」などの CSS セレクターは適切であるように見えますが、すべての子孫も選択するため、番号付けが正しくなくなる可能性があります。

これに対処するには、「ul >」を使用します。 ; li" セレクターは、

    の直接の子のみを対象とします。要素。ただし、このセレクターは IE6 ではサポートされていないため、下位互換性がありません。

    回避策として、MooTools が提供するすべての子孫を返す "getElements()" メソッドを利用できます。直接の子のみを取得するには、代わりに「getChildren()」を使用します。

    CSS セレクターを「ul > li」に調整し、MooTools コード内の「getElements()」を「getChildren()」に置き換えます。を使用すると、ソートされたリストの直接の子のみがターゲットとなり、位置が正しくリセットされるようにすることができます。

以上がCSS セレクターを使用して、入れ子になった並べ替え可能なリスト内の直接の子のみをターゲットにする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。