Rumah  >  Artikel  >  hujung hadapan web  >  Bagaimana untuk Menyasarkan Kanak-Kanak Segera dalam CSS dan MooTools?

Bagaimana untuk Menyasarkan Kanak-Kanak Segera dalam CSS dan MooTools?

Mary-Kate Olsen
Mary-Kate Olsenasal
2024-11-09 00:57:02948semak imbas

How to Target Only Immediate Children in CSS and MooTools?

Pemilih CSS untuk Menyasarkan Anak Terdekat Sahaja dan Bukan Keturunan Serupa Lain

Apabila bekerja dengan elemen bersarang, selalunya perlu untuk menyasarkan anak terdekat dan mengecualikan unsur keturunan lain yang berkongsi kelas atau ID yang sama. Dalam CSS, ini mungkin mencabar untuk dicapai.

Pemilih ul > li menyasarkan hanya anak-anak terdekat

    elemen, tidak termasuk sebarang
  • elemen dalam subsenarai. Ini boleh berguna untuk menggayakan item senarai peringkat atas sambil membiarkan item bersarang tidak terjejas. Contohnya:

    #parent > li {
      color: red;
    }

    Walau bagaimanapun, adalah penting untuk ambil perhatian bahawa pemilih ini tidak disokong dalam IE6. Untuk mengekalkan keserasian ke belakang, penyelesaian adalah dengan menggunakan pendekatan berikut:

    #parent li { /* style appropriately */ }
    #parent li li { /* back to normal */ }

    Isu Khusus MooTools:

    Dalam kod MooTools yang anda sediakan, getElementsByElelements() kaedah merangkumi kedua-dua anak terdekat dan keturunan. Untuk menyasarkan kanak-kanak terdekat sahaja, gunakan getChildren() sebaliknya:

    var drop = function(el){
        el.getParents('ul').reverse().each(function(item){
            var posCount = 1;
            item.getChildren("li").getElements("a span[class=position]").each(function(pos){
                    pos.set('text', posCount);
                    posCount++;
            });
        });
    }

    Dengan menggunakan getChildren(), anda boleh memastikan bahawa penomboran dihadkan kepada elemen anak segera setiap

      bersarang, menyelesaikan masalah isu yang anda hadapi.

      Atas ialah kandungan terperinci Bagaimana untuk Menyasarkan Kanak-Kanak Segera dalam CSS dan MooTools?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn