Replikasi Menggunakan Emmet

by

Replikasi pada Emmet sangat mudah, seperti logika perkalian matematika. Fitur ini sangat membantu karena mengurangi penulisan kode berulang. Berikut contoh penggunaanya.

<!-- ketik ul>li*4 -->
<ul>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
</ul>

Sama seperti perhitungan matematika, replikasi pada emmet juga mengenal tanda kurung. Berikut contoh penggunaanya.

<!-- ketik (div>p)*4 -->
<div>
    <p></p>
</div>
<div>
    <p></p>
</div>
<div>
    <p></p>
</div>
<div>
    <p></p>
</div>

Akan sangat berguna ketika Anda membuat navigasi. Berikut contoh kasusnya:

<!-- ketik  ul>li*3>a{link}  -->
<ul>
    <li><a href="">link</a></li>
    <li><a href="">link</a></li>
    <li><a href="">link</a></li>
</ul>

<!-- ketik ul.mainNav>li*3>a -->
<ul class="mainNav">
    <li><a href=""></a></li>
    <li><a href=""></a></li>
    <li><a href=""></a></li>
</ul>

<!-- ketik ul.mainNav>li.light*3>a  -->
<ul class="mainNav">
    <li class="light"><a href=""></a></li>
    <li class="light"><a href=""></a></li>
    <li class="light"><a href=""></a></li>
</ul>
Sharing is caring:

Leave a Comment