WELCOME TO
MATERI PEMROGRAMAN WEB
Memahami Anatomi dan Cara
Kerja
Cascading Style Sheet
Definisi dan fungsi cascading style sheet
Cascading Style Sheet atau lebih
sering disebut dengan istilah CSS
merupakan salah satu dokumen website
yang bertujuan untuk mengatur 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 cep
at.
·
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.
VESI CSS DAN FITURNYA
CSS 1
Fokus mengatur pemformatan dokumen
HTML, seperti
-
Font (Jenis ketebalan).
-
Warna, teks, background dan
elemen lainnya
.
-
Text attributes, misalnya spasi
a
ntar 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
kotak yang ukur
annya dapat
diubah
-
ubah, transformasi 2
dimensi dan 2 dimensi, sudut
tumpul dan shadow
Anatomi dari cascading style sheet
–
bagian utama dari sebuah CSS itu
terdiri dari tiga bagian yaitu:
selector, property, value. Jika
dalam HTML dikenal ada tag
-
tag yang menyusun
sebuah dokumen HTML maka dalam CSS
juga dikenal dengan sebutan
selector.
Bagian CSS
Keterangan
Selector
-
nama
-
nama yang diberikan
untuk style
-
style yang berbeda,
baik itu style internal maupun
eksternal
-
bagian elemen HTML yang
akan ditunjuk untuk mengatur
style
-
dapat berupa class dan ID
Property
-
aturan dalam CSS untuk
mengubah selector yang dipilih
-
property mempunyai nilai yang
disebut dengan value
-
properties di dalam tanda { }
value.
-
Merupakan nilai dari property
CSS
0 komentar: