Lembaran Gaya Lata/Sintaks: Perbezaan antara semakan

Kandungan dihapus Kandungan ditambah
Algazel (bincang | sumb.)
Algazel (bincang | sumb.)
Bab selesai
Baris 58:
</source>
 
{{anchor|kod1}}Terjemahan pecahan kod ini adalah seperti berikut:
 
<source lang="css">
Baris 71:
</source>
 
Setiap pemilih boleh memiliki sebayaksebanyak sifat yang diperlukan. Sifat dan nilai dikurung dalam tag { }.
 
==Rules Peraturan ==
CSS rules are preceded by the {{CSS:rule|@}} symbol and are often the start of blocks of code. Rules take at least 1 argument. Some examples of rules are {{CSS:rule|@charset}}, for defining the document character set; {{CSS:rule|@media}}, for setting properties for a type of media, often {{CSS:rule|all}}, {{CSS:rule|screen}} and {{CSS:rule|print}}; and {{CSS:rule|@font}} for setting up a [[../Fonts and Text#Web Font|web font]].
 
Peraturan (''rule'') CSS didahului simbol {{CSS:rule|@}} dan sering kali memulai blok kod. Setiap peraturan menerima sekurang-kurangnya satu argumen. Beberapa contoh peraturan adalah {{CSS:rule|@charset}}, bagi mentakrif set aksara dokumen; {{CSS:rule|@media}}, bagi menetapkan sifat jenis media, kerap kali {}{CSS:rule|all}} ("semua"), {{CSS:rule|screen}} ("skrin") dan {{CSS:rule|print}} ("cetak"); dan {{CSS:rule|@font}} ("fon") bagi menetapkan [[../Fon dan Teks#Fon Sesawang|fon sesawang]].
==Selectors==
Selectors are where most of the power in CSS lies. Selectors allow the author to specifically target an element to apply any given property to. Many different selector types can be combined for the precision application of styles.
 
===Elements= Pemilih ==
Elements that are specified in CSS definitions (abbreviated E, F, etc.) correspond to the (X)HTML or XML elements in the document. In HTML or XHTML, common elements include <code>p</code>, <code>span</code>, and <code>div<code>. In XML, the element names will vary with the type of document to be displayed.
 
Kuasa CSS kebanyakannya terletak pada pemilih. Pemilih membolehkan pengarang untuk mensasarkan unsur tertentu bagi mengenakan apa jua sifat. Pelbagai jenis pemilih dapat digabungkan bagi mewujudkan gaya yang lebih halus.
===Class===
Class is the most basic of the selectors. The class operator is a "<code>.</code>" and the syntax is <code>E.classname</code>.
 
===ID Unsur ===
Unsur yang ditetapkan dalam definisi CSS sepadan dengan unsur-unsur (X)HTML atau XML dalam dokumen. Dengan HTML atau XHTML, unsur yang sering ditemui termasuk <code>p</code>, <code>span</code>, dan <code>div<code>. Dengan XML, nama unsur akan berubah, bergantung kepada jenis dokumen yang akan dipaparkan.
ID specifies a unique element in the document and in (X)HTML it is also the fragment identifier. The ID operator is a "<code>#</code>" and the syntax is <code>E#IDname</code>.
 
===Attribute Kelas===
Kelas adalah pemilih yang paling asas. Operator kelas ialah "<code>.</code>" (titik) dan sintaksnya adalah <code>.nama_kelas</code>.
Attribute selection is a newer feature in CSS that allows selection based on any attribute of the element. The syntax is <code>E[Attribute="value"]</code>. Attribute supports several different matching operators, including <code>=</code>, <code>!=</code>, <code>~=</code>, <code>^=</code> and <code>$=</code>.
 
{{XNote|Kelas sentiasa didahului oleh "." Tanda titik perlu kerana ia mengasingkan pemilih kelas daripada apa jua perkara yang boleh digabungkan dengannya.}}
===Pseudo-class===
Pseudo-classes are special classes based on the state of an element and uses the <code>:</code> operator. The syntax is <code>E:pseudo-class</code>. Commonly used pseudo-classes include <code>:hover</code>, <code>:link</code> and <code>:visited</code>...
 
==Blocks= ID ===
ID menetapkan unsur ''unik'' dalam dokumen. Dengan (X)HTML ia juga menjadi pengecam cebisan atau ''fragment identifier''. Operator ID ialah "<code>#</code>" dan sintaksnya <code>#nama_id</code>.
Blocks of code are everywhere in CSS. A block is started with <code>{</code> and closed with <code>}</code>. Blocks are used to group CSS statements into logical groups based on the author's needs. Blocks are most commonly used by Rules and to group properties to a selector.
 
{{XNote|Perhatikan bahawa fungsi 'kelas' dan 'ID' hampir sama, yakni kedua-dua bertindak sebagai pemilih. Hanya, ID pemilih unik}}
==Properties==
 
Properties are the meat of CSS. The syntax is quite simple, <code>property: argument(s);</code>. Properties are always after a selector and always inside a <code>{}</code> block. A property must be ended with a <code>;</code> to close it.
=== Atribut ===
Pilihan atribut ialah ciri baharu CSS yang membolehkan pilihan dibuat berlandaskan apa jua atribut sesebuah unsur. Sintaksnya adalah <code>[Atribut="nilai"]</code>. Atribut mendokong beberpa operator yang berlainan, termasuk <code>=</code>, <code>!=</code>, <code>~=</code>, <code>^=</code> dan <code>$=</code>.
 
=== Pseudokelas ===
Pseudokelas (''pseudo-class'') adalah kelas istimewa berlandaskan keadaan unsur dan memiliki operator <code>:</code>. Sintaks adalah <code>:pseudokelas</code>. Pseudokelas yang sering ditemui termasuk <code>:hover</code> ("hover" harfiah terbang terkantung-kantung), <code>:link</code> ("pautan") dan <code>:visited</code> ("telah dilawati").
 
== Blok ==
Blok kod terdapat di merata tempat dengan CSS. Blok bermula dengan <code>{</code> dan berakhir dengan <code>}</code>. Blok digunakan untuk menghimpun penyataan CSS dalam kumpulan logikal bergantung kepada keperluan pengarang. Blok paling sering diguna bersama-sama peraturan dan bagi menghimpun sekumpulan sifat pada sesuatu pemilih.
 
== Sifat ==
Sifat (''property'') merupakan inti CSS. Sintaksnya mudah, yakni <code>property: argument(s);</code> (lihat [[#kod1|kod]] di atas). Sifat sentiasa diletakkan selepas sesuatu pemilih dan sentiasa di dalam blok <code>{}</code>. Sesuatu sifat perlu diakhiri atau ditutup dengan koma bernoktah (<code>;</code>).
 
{{Prognav|Lembaran Gaya Lata|Mengguna CSS pada XML|Mentakrif Peraturan Gaya}}