Pseudo-Elements

CSS Pseudo-elemen
«Sebelumnya
Tonton video tutorial ini
Next Chapter »
Apa Pseudo-Elements?

Sebuah CSS pseudo-elemen yang digunakan untuk gaya tertentu bagian dari elemen.

Sebagai contoh, dapat digunakan untuk:

     Gaya huruf pertama, atau jalur, dari elemen
     Sisipkan konten sebelum, atau setelah, isi elemen

sintaksis

Sintaks pseudo-elemen:
pemilih :: pseudo-elemen {
     property: value;
}

The :: lini pertama Pseudo-elemen

The :: lini pertama pseudo-elemen digunakan untuk menambah gaya khusus untuk baris pertama dari teks.

The :: lini pertama pseudo-elemen hanya dapat diterapkan untuk memblokir elemen.
contoh

Format baris pertama dari teks dalam elemen p:
p :: lini pertama {
     color: # ff0000;
     font-variant: small-caps;
}

Cobalah sendiri »

Properti berikut berlaku untuk :: lini pertama pseudo-elemen:

     properti font
     sifat warna
     properti background
     kata-spacing
     letter-spacing
     text-decoration
     vertical-align
     text-transform
     line-height
     jelas

The :: pertama huruf Pseudo-elemen

The :: pertama huruf pseudo-elemen digunakan untuk menambah gaya khusus dengan huruf pertama dari teks.

The :: pertama huruf pseudo-elemen hanya dapat diterapkan untuk memblokir elemen.
contoh

Format huruf pertama dari teks dalam elemen p:
p :: pertama huruf {
     color: # ff0000;
     font-size: xx-besar;
}

Cobalah sendiri »

Properti berikut berlaku untuk :: pertama huruf elemen pseudo:

     properti font
     sifat warna
     properti background
     sifat marjin
     sifat bantalan
     sifat perbatasan
     text-decoration
     vertical-align (hanya jika "mengambang" adalah "none")
     text-transform
     line-height
     mengapung
     jelas

Pseudo-elemen dan Kelas CSS

Pseudo-elemen dapat dikombinasikan dengan kelas CSS:
contoh
p.intro :: pertama huruf {
     color: # ff0000;
     font-size: 200%;
}