Təmiz CSS-da 8 faydalı imkan: 4) Custom bullet-lar
Digər
Code-News
09.03.2019
Farid Pardashunas
#Step IT Academy tərəfindən təqdim olunur
CSS texnologiyasında 8 faydalı həllər barədə olan məqalə seriyasına davam edirik.
Öncəki hissələr:
4. Custom bullet-lar
Siyahılarda bullet-ları məqsədə uyğun reallaşdırmaq üçün content ilə psevdoelement ::before işlətmək olar.
Aşağıdakı CSS-da fərqli bullet-lar üçün iki class: .complete və .incomplete istifadə olunub.
Bonus: breadcrumps
Content ilə çoxlu maraqlı həllər reallaşdırmaq olur. Bonus olaraq birini daha deyirik.
Slash və digər simvollar breadcrumps-da stilistik tərkib hissəsi olduğu üçün onları CSS-da təyin etmək daha məntiqli olar. Nümunədə CSS3-ün imkanlarından olan last-child istifadə olunub:
.breadcrumb a:first-child::before { content: " » "; } .breadcrumb a::after { content: " /"; } .breadcrumb a:last-child::after { content: ""; }
Linki kopyala
Bənzər xəbərlər
Oxşar xəbərlər
Həftənin xəbərləri
YouTube öz yeni dizaynını test etməyə başlayıb
Telegram-ın yaradıcısı Pavel Durov geniş müsahibə verib (VİDEO)