Rumah  >  Artikel  >  hujung hadapan web  >  Asas CSS CSS Selectors_Tutorial Asas

Asas CSS CSS Selectors_Tutorial Asas

WBOY
WBOYasal
2016-05-16 12:06:101861semak imbas

Contoh:

*[lang=fr] { saiz fon:14px; }

*.div { text-decoration:none; 🎜>
2. Pemilih jenis
Sintaks:

E { sRules }

Penerangan:
Pemilih jenis. Gunakan jenis objek bahasa dokumen (Elemen) sebagai pemilih.
Contoh:

td { font-size:14px; }

a { text-decoration:none; 🎜>Sintaks:

E [ attr ] { sRules }

E [ attr = value ] { sRules }

E [ attr ~= value ] { sRules }

E [ attr |= value ] { sRules }

Penerangan:
Pemilih atribut.
Pilih E dengan atribut attr
Pilih E dengan atribut attr dan nilai atribut sama dengan nilai
Pilih E dengan atribut attr dan nilai atribut ialah senarai perkataan yang dipisahkan dengan ruang, salah satunya adalah sama dengan nilai . Nilai di sini tidak boleh mengandungi ruang
Pilih atribut attr dan nilai atribut ialah senarai perkataan yang dipisahkan oleh tanda sempang, bermula dengan nilai E
Contoh:

h[title] { color: blue; }

/* Semua h objek dengan atribut tajuk */



span[class=demo] { color: red; }



div[speed="fast"][dorun="no"] { color: red; }



a[rel~="copyright"] { color :black; }

4. Mengandungi pemilih
Sintaks:

E1 E2 { sRules }


Penerangan:
mengandungi pemilih. Memilih semua E2 yang terkandung oleh E1 . Iaitu, E1.mengandungi(E2)==benar.
Contoh:

jadual td { font-size:14px; }



div.sub a { font-size:14px; >5. Pemilih sub-objek
Sintaks:

E1 > E2 { sRules }

Penerangan:
Pemilih sub-objek. Memilih semua E2 yang merupakan anak kepada E1 .
Contoh:

badan > p { font-size:14px; }

/* Saiz fon bagi semua objek p yang merupakan objek kanak-kanak badan ialah 14px */



div ul>li p { font-size:14px; }

6.ID selector
Syntax:

#ID { sRules }


Penerangan:
Pemilih ID. Gunakan ID sebagai pengecam unik objek dalam pepohon dokumen (DOM) sebagai pemilih.
Contoh:

#note {font-size:14px; width:120px;}

7 Pemilih kelas
Sintaks:

E.className {. sRules }

Penerangan:
pemilih kelas. Pemilih ini boleh digunakan dalam HTML. Kesannya bersamaan dengan E [ class ~= className ]. Lihat Pemilih Atribut.
Dalam IE5+, anda boleh menentukan lebih daripada satu nilai ( className ) untuk atribut kelas (property) objek dengan menentukan set nama kelas helaian gaya yang dipisahkan oleh ruang. Contohnya:
.
Contoh:

div.note { font-size:14px; }

/* Saiz fon semua objek div yang nilai atribut kelasnya sama dengan (termasuk) "note" ialah 14px */


.dream { font-size:14px; }

/* Saiz fon semua objek yang nilai atribut kelasnya sama dengan (termasuk) "nota" ialah 14px */


8 Pengumpulan pemilih
Sintaks:

E1 , E2 , E3 { sRules }

Penerangan:
Pengumpulan pemilih. Untuk menggunakan definisi yang sama pada berbilang pemilih, anda boleh menggabungkan pemilih ke dalam kumpulan yang dipisahkan koma.
Contoh:

.td1,div a,body { font-size:14px; }

td,div,a { font-size:14px }


9. Pemilih kelas Pseudo dan objek pseudo

Sintaks:

E : Kelas Pseudo { sPeraturan }

E : Elemen Pseudo { sPeraturan}

Penerangan:
Kelas pseudo dan pemilih objek pseudo.
Pemilih kelas pseudo. Lihat Kelas Pseudo[:link :hover :active :visited :focus :first-child :first :left :right :lang].
Pemilih objek pseudo. Lihat Elemen Pseudo[:huruf pertama:baris pertama:sebelum:selepas].
Contoh:

div: huruf pertama { font-size:14px; }

a.fly:hover { font-size:14px;
Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn