Cascading Style Sheet Mobile Profile
mengoptimalkan isi untuk presentasi pada berbagai device. Setiap aspek dari penampilan
peletakkan, font, atribut teks, border, margin alignment, atau lainnya dapat didefinisikan
menggunakan style sheet. Juga, dengan menggunakan style sheet eksternal yang dipakai
bersama-sama oleh beberapa naskah, perubahan pada suatu aspek dari semua naskah pada
sebuah situs hanya perlu sekali saja dibuat.
A. Mengendalikan Presentasi
Secara garis besar, CSS dapat mengendalikan presentasi
isi naskah dengan melingkupi:
- Spacing, padding dan margin
- Alignment
- Font dan atribut teks
- Border
- Warna pada device yang memiliki kemampuan
Perwarnaan
- Mengubah warna teks dan latar (background) pada devais yang memiliki kempuan pewarnan
- Format mask untuk input teks menggunakan
- wap-input-format.
B. Inline Style
Microbrowser memberikan sedikit kontrol untuk desainer terhadap halaman naskah
XHTML MP yang dibuatnya. Beberapa tag dan atribut yang terdapat dalam HTML telah
dikeluarkan dari XHTML MP. Hal ini membuat desainer akan merasa dibatasi untuk
membuat styling dengan tag XHTML MP beserta atributnya.
1: <?xml version=“1.0”?>
2: <! DOCTYPE html PUBLIC “-//OPENWAVE// DTD XHTML Mobile 1.0//EN”
http://www.openwave.com/DTD/xhtml-mobile10.dtd>
3:
4: <html xmlns=http://www.w3.org/1999/xhtml>
5. <head>
6: </head>
7: <body>
8: < p style=“text-decoration: underline”>beCraft’s Mobile Shop</p>
9: </body>
10: <html>
C. Style Sheet Internal
Style sheet internal akan menerapkan gaya yang ditentukan kepada semua elemen
yang ditentukan dalam naskah, tanpa perlu ditulis ulang setiap kali elemen tersebut muncul
seperti pada inline sheet.
1: <?xml version=“1.0”?>
2: <! DOCTYPE html PUBLIC “-//OPENWAVE// DTD
XHTML Mobile 1.0//EN”
http://www.openwave.com/DTD/xhtml-mobile10.dtd>
3:
4: <html xmlns=http://www.w3.org/1999/xhtml>
5. <head>
6: </title>Home beCraft</title>
7: <style>
8: < /* garis bawah untuk semua teks dalam paragraf */
9: p {text-decoration: underline;}
10: </style>
11: </head>
12: <body>
13: <p>beCraft’s Mobile Shop</p>
14: <p>Menjual berbagai produk kerajinan.</p>
15: </body>
Penerapan style sheet internal pada naskah
D. Style Sheet Eksternal
CSS dapat digunakan untuk banyak hal, bukan hanya untuk menambahkan warna
atau garis bawah pada sebuah bagian teks. CSS dapat digunakan untuk meletakkan suatu
elemen dala suatu halaman, menambahkan batas (border), bahkan dapat digunakan untuk
mengontrol volume dari suatu halaman dalam aplikasi audio.
CSS sangat luar biasa berguna karena satu style sheet dapat diterapkan untuk
beberapa dokumen sekaligus. Sebagai contoh, pengguna dapat membuat keseluruhan dari
sebuah situs menggunakan satu style sheet dan ketika pengguna ingin mengubah bentuk
presentasi situs tersebut pengguna hanya mengubah style sheetnya. Untuk membuat style
sheet seperti itu(yang dapat diaplikasikan ke banyak dokumen), pengguna perlu membuat
style sheet yang berada di luar dokumen, kemudian menghubungkan semua dokumen
kepada style sheet tersebut.
E. Aturan Cascading
Aturan cascading memberikan urutan seperti di bawah ini:
1) Default dari browser
2) Style Sheet Eksternal
3) Style Sheet Internal
4) Inline Style
F. Yang harus dihindari
Pengguna bebas menentukan gaya presentasi naskah pada layar, namun beberapa
penentuan gaya berikut sebaiknya dihindari agar tidak mendapatkan kerugian yang
ditimbulkan dari penentuan gaya:
1) Hindari penonaktifan wrapping baris untuk isi XHTML.
2) Hindari penghilangan garis bawah dari anchor (elemen <a>).
3) Hindari penggunaan properti text-decoration:underline pada teks biasa.
4) Hindari penekanan teks yang terlalu banyak melalui penggunaan properti font-style
dan font-variant, khususnya pada halaman XHTML yang sama
5) Hindari penggunaan terlalu banyak jenis font (property font-family) dan ukuran
ukuran font (property font weight dan property-size) yang berbeda dalam satu
halaman XHTML yang sama.
6) Jangan menghilangkan border pada tabel yangdigunakan untuk menunjukkan
informasi dalam suatu bentuk tabular, sehingga tidak tampak seperti suatu informasi
yang biasa (bersambung/bukan tabular).
7) Saat mungkin, tentukan gaya menggunakan aturan casading bukan menggunakan
atribut class atau id di dalam elemen-elemen.
Berikut contoh soal beserta jawabanya :
