CSS-pemilih, dan perannya dalam format html-dokumen

click fraud protection

Membuat sebuah situs web dan mengisinya dengan unsur-unsur tertentu dari suatu halaman web, semua orang akan menghadapi istilah seperti CSS-pemilih.Ini berfungsi untuk paling akurat menentukan semua elemen html-file desain dan lokasi mereka pada halaman.Untuk melakukan ini, membuat CSS-dokumen yang merinci pemilih tertentu dan pilihan format mereka: warna, ukuran, posisi, dan lainnya.Setiap desainer web harus tahu dan dapat benar masukkan tanggal pemilih.Mereka dibagi berdasarkan jenis, yang utama yang kita bahas di bawah.

Jenis pemilih di CSS

Tergantung pada apa html-elemen berlaku format, CSS-pemilih bisa merujuk ke salah satu dari kelompok berikut:

  • tag selector;
  • pemilih kelas;
  • id-selector;Atribut
  • pemilih.Tag selector

Hal ini juga disebut "jenis selector" dan "pada item", ini adalah yang paling sederhana dan umum.Sebagai CSS-dokumen itu adalah nama-nama elemen html-file yang yang kami jelaskan.Sebagai contoh, jika kita perlu mengatur gaya paragraf, kita menentukan sifat dan nilai-nilai mereka untuk elemen p {background: x;Warna: y;Ukuran: z}.Dalam hal ini, semua halaman web paragraf akan memiliki format yang sama (warna latar belakang, ukuran teks dan sejenisnya. D.).

pemilih kelas

Tapi bagaimana jika Anda perlu bertanya setiap paragraf Anda berbeda dari gaya lain?Untuk tujuan ini ada pemilih kelas.

CSS-dokumen kasus ini, akan berisi entri yang mirip dengan berikut: p.first {color: x;font-size: y}.Dengan demikian, kita mendefinisikan sifat-sifat "warna" dan "ukuran" hanya untuk sebuah paragraf dari kelas.

di html-dokumen kasus ini, masukkan atribut class dengan nama gaya pertama.Kelas dapat sebanyak gaya Anda ingin menerapkan untuk elemen halaman web.

pemilih id

Seringkali ada kebutuhan untuk mendefinisikan gaya lebih tepat, misalnya untuk salah satu elemen dari halaman atau dalam sampel mereka.Dalam situasi ini, bantuan datang id-selector.File html menetapkan diinginkan nama item yang mengidentifikasi itu antara lain.Misalnya, unsur yang kita ingin mengatur gaya yang berbeda dari yang lain, akan judul artikel.

Kemudian menetapkan html-dokumen sundulan h1 identifier, articlename tersebut.Dan di CSS-file untuk mengatur gaya, menambah identifier nama grille: #articlename {color: blue;text-align: center}.Sekarang utama kami akan menjadi warna biru dan berpusat.

Setiap jenis di atas dapat disebut "CSS-pemilih yang sederhana."Mereka mendefinisikan format untuk parameter html-dokumen tertentu: elemen bersama-sama semacam itu (misalnya, semua paragraf artikel), satu kelas (misalnya, hanya paragraf pertama) atau item tertentu (misalnya, judul artikel).

pemilih atribut Selain

ke atas, ada CSS-in penyeleksi atribut - cara yang lebih canggih untuk menggunakan gaya.Hal ini memungkinkan elemen format html dari atribut atau nilai yang dipilih.Ada beberapa jenis pemilih ini:

  • oleh adanya atribut;
  • pada nilai eksaknya;
  • nilai atribut parsial;
  • nilai khususnya.

Mari kita masing-masing varietas ini:

  1. kasus pertama.Format diterapkan jika ada atribut tertentu dalam html-kode (bisa p, div, header, dll).Jika tidak, ia menggunakan generik untuk semua elemen dari gaya.Misalnya, unsur memiliki judul (tooltip).
  2. kasus kedua.Gaya hanya berlaku untuk html-elemen yang merupakan nilai atribut sama persis.Misalnya, untuk unsur-unsur masukan, dimana nilai dari jenis atribut yang sama untuk mengirimkan.
  3. kasus ketiga.Di bawah format hanya akan menyertakan item dalam daftar nilai yang memiliki kata tertentu.Misalnya, Sidebar atribut "kelas" dalam elemen div.
  4. kasus keempat.Gaya didefinisikan hanya untuk elemen-elemen html-dokumen yang atribut tertentu memiliki nilai tertentu, dan dimulai dengan dia.Misalnya, penggunaan warna yang ditentukan untuk semua elemen, atribut yang bahasa Inggris (bisa en, en-rus, en-au dan sebagainya. D.).

demikian, menggunakan satu atau lain CSS-selector terbaik dapat ditempatkan di halaman web secara keseluruhan, dan menjelaskan beberapa elemen.