pemrograman web

WELCOME TO




MATERI PEMPROGRAMAN WEB
Memahami Anatomi dan Cara Kerja Cascading Style Sheet
1.Definisi dan fungsi cascading style sheet
Cascading Style Sheet atau lebih sering disebut dengan istilah CSS merupakan salah satu dokumen website untuk mengatur yang rtbeujuan gaya (style) tampilan website

penggunaan dari CSS dalam pembuatan web akan memberikan beberapa manfaat seperti berikut ini :
· Kode HTML menjadi lebih sederhana dan lebih mudah diatur.
· Ukuran file menjadi lebih kecil sehingga load file lebih cepat.
· Mudah untuk mengubah tampilan, hanya dengan mengubah file CSS saja.
· Dapat berkolaborasi dengan JavaScript dan merupakan pasangan setia HTML.
· Dapat digunakan dalam hampir semua jenis web browser.


Versi CSS     Fitur CSS           
CSS 1
    Fokus mengatur pemformatan dokumen HTML, seperti
- Font (Jenis ketebalan).
-Warna, teks, background dan
elemen lainnya.
- Text attributes, misalnya spasi
antar baris, kata dan huruf.
- Posisi teks, gambar, table dan elemen lainnya.
- Margin, border dan padiing.       
CSS 2     - Mengatur format dokumen untuk kebutuhan di cetak
dengan printer
- Posisi konten
- Downloadable
- Font huruf
- Table layout
- Media tipe yang       
CSS 3     -Sangat mendukung tampilan desain website
- Animasi warna bahkan sampai animasi 3D
- Menunjang kompabilitas website dengan smartphone
- CSS math
- CSS obyek model
- Mendukung fungsi multimedia pada website
- Beberapa efek teks, seperti teks berbayang, kolom
koran, dan "word-wrap"
-Jenis huruf eksternal, sehingga dapat menggunakan
huruf yang tidak termasuk "web-safe fonts".
-Beberapa efek pada kotak, seperti    

Cara Kerja cascading style sheet
Cara kerja CSS dimulai saat deklarasi style yang diinginkan dengan menulis style (selektor, id dan class), maka secara otomatis style tersebut akan
bekerja pada dokumen HTML. Dengan mengatur selektor, id, dan class,
untuk kemudian id dan class tersebut kita sesuaikan dan terapkan pada
kode HTML . Dan secara otomatis pula CSS itu akan bekerja pada file HTML.

 External Style Sheet
<input type="submit" value="Login" class="btn"
onClick=parent.location="Home_Iframe.htm" />
CSS didefinisikan secara terpisah pada file yang berbeda. Dan selanjutnya file atau halaman web yang ingin menerapkan style pada file CSS tersebut tinggal memanggil file CSS tersebut. Cara ini umumnya digunakan pada satu aplikasi berbasis web sehingga tampilan antar halaman akan terlihat konsisten.





Menyajikan Cascading Style Sheet untuk Memformat Tampilan Teks

sytle dalam kemasan CSS

Properti     Keterangan       
Color     Mengatur warna dari teks       
Direction     Menentukan arah tulisan/teks       
letter-spacing     Menambah ataupun mengurangi spasi antar karakter dalam teks       
line-height     Mengatur tinggi baris teks       
text-align     Menentukan batas teks secara horisontal       
text-decoration     Menentukan dekorasi/hiasan pada teks       
text-indent     Menentukan jarak inden dari baris pertama dalam teks-blok       
text-shadow     Menentukan efek bayangan pada teks       
text-transform     Mengatur huruf besar-huruf kecil dari teks    
 
   


       
vertical-align     Menentukan batas teks secara horisontal       
white-space     Menentukan penulisan white-space pada elemen       
word-spacing     Menambah ataupun mengurangi spasi antar kata dalam teks