Makna tanda kurung dalam CSS

Pengarang: Judy Howell
Tarikh Penciptaan: 2 Julai 2021
Tarikh Kemas Kini: 11 November 2024
Anonim
CSS Bagian 1: Pengenalan
Video.: CSS Bagian 1: Pengenalan

Kandungan

CSS akronim berasal dari bahasa Inggeris "lembaran gaya cascading", atau "lembaran gaya cascading". CSS memberikan tahap artistik dan reka bentuk yang lebih besar kepada pemaju dan pereka web dengan memisahkan kandungan dari parameter paparan. Kenyataan CSS diletakkan di tajuk dokumen web dan kemudian dipaparkan di dalam badan halaman web oleh penyokong - {}. Di dalam pendakap adalah kurungan - () - atau kurungan - [] - yang menunjuk elemen CSS lain.


Kurungan CSS digunakan di dalam badan dokumen web (Comstock / Comstock / Getty Images)

Kunci

Kekunci adalah unsur utama sintaks CSS. Ini bermakna pembukaan dan penutupan semua parameter CSS yang terkandung di dalamnya. Mewakili sebagai {}, mereka mengikuti elemen CSS yang bermaksud imej, kedudukan, unsur paparan, atau gabungan unsur-unsur. Kekunci boleh wujud di dalam mana-mana unsur / lapisan div dan sentiasa berada di dalam tag "</ body>". Inilah contohnya:

div # example {padding: 5px; margin: 20px; lebar: 350px; }

Parentheses

Unsur-unsur hubungan, seperti peratusan dan warna, disertakan dalam kurungan. Parenthes memberikan definisi tambahan kepada elemen CSS. Dalam versi CSS sebelum CSS3, kurungan boleh menentukan elemen dengan cara yang sama seperti kekunci. Dua contoh adalah warna (ditakrifkan oleh kod heksadesimal) dan imej latar belakang:


warna: rgb (128, 128, 255); imej: url ("/ images / bg.png")

Kurungan

Kurungan - [] - yang dikenali sebagai pemilih atribut, digunakan untuk menetapkan nilai atribut unsur. Terdapat empat nilai berbeza dalam CSS2 dan ditambah tetapi tiga dengan CSS3. Empat pemilih asal menentukan kehadiran atribut - [tajuk], sepadan dengan mana-mana unsur yang mempunyai atribut "tajuk" yang ditentukan; nilai atribut yang mudah - input [type = "send"], sepadan dengan mana-mana unsur input yang jenis atributnya sama dengan "hantar"; nilai atribut senarai - p [class ~ = "sastera"], bersamaan dengan perenggan yang atribut kelasnya adalah senarai kata-kata yang dipisahkan oleh ruang, salah satunya ialah "sastera"; dan nilai atribut separa - [href ^ = "http:"], sepadan dengan pautan elemen yang nilai atributnya bermula dengan "http:". Tanda kurung tidak banyak digunakan sebelum pengenalan Internet Explorer 7, kerana IE6 tidak mengenali mereka.


Banyak simbol algebra digunakan sebagai elemen CSS (BananaStock / BananaStock / Getty Images)

Chevrons

Pemilih dan seksyen bahasa markup hiperteks asas (HTML) dan dokumen markup bahasa (XML) diperpanjang dibatasi oleh tanda kurung yang dikenali sebagai chevrons . Mereka juga mewakili elemen kanak-kanak beberapa elemen CSS. Dalam CSS, "pemilih anak" terdiri daripada dua atau lebih item yang dipisahkan oleh chevron ">". Ini menandakan bahagian tertentu dari laman web: badan, yang mana halamannya kelihatan; lapisan, yang boleh disusun seperti kepingan kertas di atas satu sama lain; atau titrasi, menandakan objek atau tarikh tertentu yang dikenali sebagai "mikroformat".

Nota CSS

Dipisahkan daripada kurungan CSS, tetapi masih alat organisasi yang berharga untuk susun atur CSS yang rumit, mereka adalah nota helaian gaya. Ini adalah komen yang tidak menambah apa-apa pada kod HTML, dan oleh itu tidak meningkatkan masa memuatkan halaman; mereka menyediakan garis besar untuk CSS yang panjang dan rumit. Nota dalam CSS ditempatkan dalam atribut mereka sendiri - / * - seperti ini:

/ Sebarang komen terkandung dalam segmen yang dibatasi oleh garis miring dan asterisk. /

Mereka boleh menjadi sangat berharga untuk membantu anda menavigasi sekeping lembaran gaya cascading.

CSS boleh membantu anda merancang halaman untuk saiz skrin yang berbeza tanpa membuat susun atur yang berasingan (Comstock / Comstock / Getty Images)

Rujukan

  • "Penguasaan CSS: Penyelesaian Piawaian Web Lanjutan"; Andy Budd, et al.; 2009
  • Sekolah W3: Sintaks CSS
  • "Rujukan CSS Ultimate"; Tommy Olsson, et al.; 2008

Penerbangan

  • W3C: CSS Selectors [dalam bahasa Inggeris]
  • New2HTML: Sintaks CSS [dalam Bahasa Inggeris]