CSS ::after sahte öğesi
- Önceki sayfa ::after
- Sonraki sayfa ::backdrop
- Bir üst seviyeye dön CSS Pseudo-Element Referans El Kitabı
Tanım ve Kullanım
CSS ::after
Takma elementler, belirtilen elementin içeriğinin ardından içerik eklemek için kullanılır.
Kullanım content
Öznitelik belirler, eklenmesi istenen içerik. content'in değeri şu olabilir:
- Dizi: content: "Hello world!";
- Görsel: content: url(myimage.jpg);
- İçerik yok: content: none;
- Sayaç: content: counter(li);
- Sözün sonu: content: close-quote;
- Öznitelik değeri: content: " (" attr(href) ")";
İpucu:Lütfen dikkat edin, eklenen içerik hala belirtilen elementin içindedir. Eklenen içerik, elementin içeriğine eklenir.
Kullanım ::before
Belirli bir elementin içeriğinin öncesine bazı içerik ekleyin.
Örnek
Örnek 1
Her <p> öğesinin içeriğinin ardından bir dizi ekleyin:
p::after { content: " - Bu hatırlatmayı unutmayın"; }
Örnek 2
Her <p> öğesinin içeriğinin ardından bir dizi ekleyin ve eklenmiş içeriğin stilini ayarlayın:
p::after { content: " - Bu hatırlatmayı unutmayın"; background-color: yellow; color: red; font-weight: bold; }
CSS Grameri
::after { css deklarasyonları; }
Teknik Ayrıntılar
Sürüm: | CSS2 |
---|
Tarayıcı Desteği
Tabloda belirtilen rakamlar, bu takma elemanın tamamen desteklenen ilk tarayıcı sürümünü belirtir.
Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|
4.0 | 9.0 | 3.5 | 3.1 | 7.0 |
İlgili Sayfalar
Eğitim:CSS Takma Elemanları
Referans:CSS ::before sahte öğesi
- Önceki sayfa ::after
- Sonraki sayfa ::backdrop
- Bir üst seviyeye dön CSS Pseudo-Element Referans El Kitabı