Bu blog aşağıdaki içerik alanlarını kapsamaktadır:
- Arka Rüzgarda Vurgulama, Odaklanma ve Etkin Durumlarla Metin Dekorasyonu Nasıl Uygulanır?
- 'Vurgulu' Durumuyla Metin Dekorasyonu Uygulama.
- Metin Dekorasyonunu 'odak' Durumuyla uygulama.
- Metin Dekorasyonunu 'aktif' Durumla uygulama.
Arka Rüzgarda Vurgulama, Odaklanma ve Etkin Durumlarla Metin Dekorasyonu Nasıl Uygulanır?
Metin “ ile dekore edilebilir metin dekorasyonu ' mülk. Bu özellik, ' gibi çeşitli değiştirici durumlarla uygulanabilir. vurgulu ', ' odak ' Ve ' aktif ” metni kullanıcının eylemi üzerine uygun şekilde dekore etmek için.
Örnek 1: 'Vurgulu' Durumuyla Metin Dekorasyonunu Uygulama
Bu örnek şu şekilde geçerlidir: metin dekorasyonu ” özelliği, varsayılan olarak altı çizili olmayacak, ancak fareyle üzerine gelindiğinde altı çizili hale gelecek şekilde:
< HTML >
< KAFA >
< meta karakter seti = 'utf-8' >
< meta isim = 'görüntü alanı' içerik = 'genişlik=aygıt genişliği, başlangıç ölçeği=1' >
< senaryo kaynak = 'https://cdn.tailwindcss.com' >< / senaryo >< / KAFA >
< vücut >
< metin alanı sınıf = 'altı çizili olmayan vurgulu:altı çizili' > Bu Tailwind CSS'dir < / metin alanı >
< / vücut >
< / HTML >
Bu kod satırlarına göre CDN yolunu “
Çıktı
Görüldüğü gibi “
Örnek 2: 'Odak' Durumuyla Metin Dekorasyonunu Uygulama
Aşağıdaki kod bloğu metni “ odak ' durum. Bu, öğenin “” aracılığıyla odaklandığı anda metnin altını çizer (varsayılan olarak altı çizilmez). Sekme ' anahtar:
< HTML >
< KAFA >
< meta karakter seti = 'utf-8' >
< meta isim = 'görüntü alanı' içerik = 'genişlik=aygıt genişliği, başlangıç ölçeği=1' >
< senaryo kaynak = 'https://cdn.tailwindcss.com' >< / senaryo >< / KAFA >
< vücut >
< metin alanı sınıf = 'altı çizili olmayan odak:altı çizili' >Bu Tailwind CSS'sidir< / metin alanı >
< / vücut >
< / HTML >
Bu koda göre:
- Benzer şekilde, CDN yolunu ekleyin ve “
” öğesi. - Bundan sonra “ metin dekorasyonu ” Metnin varsayılan olarak altının çizilmemesini sağlayan özellik.
- Ilişkili ' odak ” durumu daha sonra öğe odaklandığında metnin altını çizer.
Çıktı
Bu sonuç “” tuşuna basıldığında öğenin içerdiği metnin altının çizildiği anlamına gelir. Sekme ” anahtarı, yani öğenin odaklanmasını sağlamak.
Örnek 3: Metin Dekorasyonunu 'aktif' Durumla Uygulamak
Bu örnekte metin şu şekilde dekore edilebilir: ' hat boyunca ” özelliği, elemanın aktif olması üzerine uygulanır:
< HTML >
< KAFA >
< meta karakter seti = 'utf-8' >
< meta isim = 'görüntü alanı' içerik = 'genişlik=aygıt genişliği, başlangıç ölçeği=1' >
< senaryo kaynak = 'https://cdn.tailwindcss.com' >< / senaryo >< / KAFA >
< vücut >
< metin alanı sınıf = 'alt çizgi yok etkin:satır geçişli' >Bu Tailwind CSS'sidir< / metin alanı >
< / vücut >
< / HTML >
Bu kod parçacığında aşağıda verilen adımları uygulayın:
- CDN yolunu dahil etmek için tartışılan metodolojileri ve “
” öğesi. - Şimdi “metin dekorasyonunu uygulayın” altı çizili değil ” özelliğini varsayılan olarak seçin ve “ aktif ' ile durumu ' hat boyunca ”.
- Bu sonuç olarak öğenin aktif olması üzerine içerilen metnin içinden geçer.
Çıktı
Bu çıktıdan metnin uygulanan duruma uygun şekilde dekore edildiği doğrulanabilir.
Çözüm
Metin “ ile dekore edilebilir metin dekorasyonu ' mülk. Bu özellik “ ile uygulanabilir. vurgulu ', ' odak ' Ve ' aktif ' değiştirici, sırasıyla fareyle üzerine gelindiğinde, odaklanılan öğede veya etkin olan öğede metni süslemeyi belirtir.