InternetDesain web

CSS-pemilih, dan perannya dalam format html-dokumen

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

Jenis selektor di CSS

Tergantung pada dimana elemen diterapkan html-diformat, CSS-pemilih mungkin berhubungan dengan salah satu dari kelompok berikut:

  • tag selector;
  • kelas pemilih;
  • id-selector;
  • atribut pemilih.

tag selector

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

selector class

Dan bagaimana jika Anda perlu untuk meminta setiap paragraf Anda berbeda dari gaya lain? Untuk melakukan hal ini, ada pemilih kelas.

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

Dalam html-dokumen kasus ini memasuki atribut kelas untuk nama gaya yang pertama. Kelas dapat sebanyak sebagai gaya Anda ingin menerapkan untuk halaman web elemen.

Pemilih id

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

Kemudian dalam html-dokumen menugaskan header h1 identifier, articlename tersebut. Dan di CSS-file yang, tentukan gaya, menambah nama ID grille: #articlename {color: blue; text-align: center}. Sekarang headline kami akan memiliki warna biru dan berpusat.

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

atribut penyeleksi

Selain di atas, ada CSS-penyeleksi atribut - metode yang lebih rumit dari gaya aplikasi. Hal ini memungkinkan elemen format html pada atribut atau nilai yang dipilih. Ada beberapa jenis pemilih ini:

  • dengan adanya atribut;
  • pada nilai eksaknya;
  • oleh nilai atribut parsial;
  • nilai spesifik.

Mari kita perhatikan masing-masing spesies ini:

  1. Kasus pertama. Format diterapkan, jika ada dalam atribut html-kode tertentu (mungkin p, div, header, dll). Jika tidak, ia menggunakan generik untuk semua elemen gaya. Misalnya, untuk unsur-unsur yang memiliki judul (tool tip).
  2. Kasus kedua. Gaya hanya berlaku untuk html-elemen yang memiliki pertandingan yang tepat dari nilai atribut. Misalnya, untuk input elemen, di mana nilai atribut tipe sama kirimkan.
  3. Kasus ketiga. Di bawah format hanya akan menyertakan item dalam daftar nilai-nilai yang memiliki kata tertentu. Misalnya, Sidebar atribut "kelas" untuk elemen div.
  4. Kasus keempat. Gaya didefinisikan hanya untuk unsur-unsur html-dokumen, yang atribut tertentu memiliki nilai tertentu, dan dimulai dengan dia. Sebagai contoh, penggunaan warna yang ditentukan untuk semua elemen yang atribut bahasa Inggris (yang mungkin en, en-rus, en-au dan t. D.).

Jadi, dengan menggunakan satu atau yang lain, pemilih CSS, terbaik dapat ditetapkan sebagai seluruh halaman web, dan menjelaskan beberapa unsur-unsurnya.

Similar articles

 

 

 

 

Trending Now

 

 

 

 

Newest

Copyright © 2018 id.birmiss.com. Theme powered by WordPress.