Difference between revisions 8089 and 8090 on mswikibooks

{{Prognav|Lembaran Gaya Lata|Mentakrif Peraturan Gaya|Pemilih}}

Bagi menetapkan lebar, tinggi dan ukuran lain, kita dapat menggunakan pelbagai unit seperti yang tersenarai dalam jadual berikut.

<!-- Nota: peratusan bukan unit. -->
{| class="wikitable"
|+ Unit dalam CSS
! Kod
! Definisi
! Nota
|-
| em
| Ketinggian fon sesuatu unsur.
|
|-
| ex
| Ketinggian huruf 'x' dalam fon unsur.
|
|-
| px
| piksel
|
|-
| mm
| milimeter
|
|-
| cm
| sentimeter
|
|-
| pt
| titik ("point", 1/72 inci)
|
|-
| pc
| pika (12 point = 1/6 inci)
|
|-
| in
| inci
|
|}

Lengths may also be specified as a percentage of another length. Using percentages can be complicated because the base length varies from property to property. For example, when percentages are used with the {{CSS:property|margin}} property the calculation is based on the width of the containing block. When percentages are used with the {{CSS:property|font-size}} property the calculation is based on the {{CSS:property|font-size}} of the parent element but with {{CSS:property|line-height}} it is based on the {{CSS:property|font-size}} of the current element.

Font sizes on screen are best given as a percentage or in <code>em</code>s. (See the note on [[../Fonts and Text#Using ems in Internet Explorer|Using ems in Internet Explorer]].) This means that the page will interact gracefully with users' font preferences. Using pixels (<code>px</code>) for font sizes causes a number of problems and should be avoided.

The absolute units <code>mm</code>, <code>cm</code>, <code>pt</code>, <code>pc</code> and <code>in</code> do not work well on screen and cause problems in many older browsers. It is safest to only use them for print media. Even in print media they may interact badly with users' preferences.

== Relative units ==
The three units <code>em</code>, <code>ex</code> and <code>px</code> are called relative units. These units do not specify a fixed length. Instead they scale relative to some other quantity. In the case of <code>em</code> and <code>ex</code> they scale relative to the font size of some elementUkuran panjang boleh ditetapkan sebagai peratusan ukuran panjang yang lain. Penggunaan peratusan boleh menjadi rumit oleh sebab panjang asas (''base length'') berlainan bagi sifat yang berlainan. Sebagai contoh, apabila peratusan digunakan dengan sifat {{CSS:property|margin}} (jidar), pengiraan dilakukan berlandaskan lebar blok yang mengandungi kandungan terserbut. Apabila peratusan digunakan dengan sifat  {{CSS:property|font-size}} (saiz fon) pengiraan berlandaskan {{CSS:property|font-size}} unusr induk akan tetapi dengan {{CSS:property|line-height}} (ketinggina baris) berlandaskan {{CSS:property|font-size}} unsur semasa.

Saiz-saiz fon pada skrin paling baik ditetapkan dengan menggunakan peratusan ataupun dalam unit <code>em</code>. (Lihat nota  [[../Fonts and Text#Using ems in Internet Explorer|Mengguna em dengan Internet Explorer]].) Ini bermakna laman akan berinteraksi dengan licin dengan keutamaan fon pengguna. Penggunaan piksel (<code>px</code>) untuk saiz fon mungkin dapat menyebabkan masalah dan harus dielak.

Unit-unit mutlak &ndash; <code>mm</code>, <code>cm</code>, <code>pt</code>, <code>pc</code> dan <code>in</code> &ndash; tidak bekerja dengan baik pada skrin dan menimbulkan masalah pada pelayar-pelayar lama. Unit-unit ini hanya harus digunakan bagi media cetak; namun dengan media cetak pun penggunaan unit-unit ini boleh menimbulkan masalah dengan keutamaan fon pengguna.

== Unit-unit Relatif ==
Ketiga-tiga unit &ndash; <code>em</code>, <code>ex</code> dan <code>px</code> are disebut unit-unit relatif. Unit-unit ini tidak menetapkan panjang yang tetap, sebaliknya unit-unit ini mengikut skala kiraan yang lain. Dalam kes <code>em</code> dan <code>ex</code> unit-unit berskala relatif kepada saiz fon sesuatu unsur.

=== Screen pixels, printer pixels and CSS pixels ===
The <code>px</code> unit specifies a length in ''CSS pixels''. These are not the same as the pixels on the screen that the document is rendered on or the dots on the printer that it is printed on. It is perfectly possible, for example, for there to be two screen pixels or five printer dots to one CSS pixel. Many web browsers use the rule that one screen pixel equals one CSS pixel for simplicity but you can not rely on th(contracted; show full)
{{Prognav|Lembaran Gaya Lata|Mentakrif Peraturan Gaya|Pemilih}}

[[Category:Cascading Style Sheets]]

[[de:Websiteentwicklung: CSS: Schriftgröße]]
[[it:CSS/Unità di misura, ereditarietà e box model]]
[[pl:CSS/Jednostki miary]]