Thursday, December 17, 2015

Pemrograman Web : Kupas Tuntas CSS (Cascading Style Sheets)



  • CSS kependekan dari  Cascading Style Sheets
  • CSS merupakan aliran dari suatu kode ke kode lain yang saling berhubungan
  • CSS adalah kumpulan kode-kode  yang berurutan dan saling berhubungan  untuk mengatur format / tampilan suatu halaman HTML
  • CSS adalah suatu teknologi yang digunakan untuk memperindah  halaman website (situs), dengan CSS kita dapat dengan mudah mengubah keseluruhan warna dan tampilan yg ada di situs kita sekaligus memformat ulang situs kita. 
  • Fungsi CSS untuk mengatur tampilan dokumen HTML (contoh : mengatur jarak baris, teks, warna, format border, penampilan file gambar dll) serta mempermudah penataan halaman web
  • Berupa kumpulan script sebagai pelengkap agar dokumen HTML dapat tampil lebih cantik dan dinamis
  • Kode CSS bersifat lintas platform (dapat dibaca oleh berbagai sistem operasi dan browser

Sintaks Kode CSS
Komposisi secara umum :
      
      Selector { property: value }
  • Selector merupakan tag HTML atau elemen (class/ID) yang dipilih
  • Property adalah atribut yang ingin anda atur nilai nya
  • Value merupakan nilai dari property, bisa berupa angka atau teks


Contoh :
    P {color: red}
  • Mewarnai seluruh teks dalam tag <p> dengan warna merah
  • P tag yang akan diatur stylenya
  • Color : salah satu property yang bisa digunakan
  • Red : value dari property color
  • Tanda “:” pendefinisian nilai property atau value
  • Tanda kurung “{“ dan “}” pendefinisian property/atribut
Ada 3 cara memasang kode CSS ke dalam kode HTML / halaman web, yaitu:
  1. Inline CSS
  2. Internal CSS / header style
  3. External/Linked CSS

Keuntungan Menggunakan CSS :
  1. Dapat di-update dengan cepat dan mudah, karena kita cukup mendefinisikan sebuah style-sheet global yang berisi aturan aturan
  2. CSS tersebut untuk diterapkan pada seluruh dokumen dokumen HTML pada halaman situs
    kita.
  3. User yang berbeda dapat mempunyai style-sheet yg berbeda pula.
  4. Ukuran dan kompleksitas document code dapat diperkecil. 
Kekurangan menggunakan CSS :
  1. Tidak semua browser mengartikan kode CSS dengan cara yang sama. 
  2. Sehingga tampilan web dengan CSS terlihat baik di browser yang satu, tapi berantakan di
    browser yang lain. 
  3. harus memeriksa tampilan supaya terlihat baik di semua browser dan menambahkan kode-kode khusus browser tertentu jika memang dibutuhkan agar tampilan web anda terlihat baik di semua browser.

No comments:

Post a Comment