teori css

4
TEORI CSS CSS adalah kependekan dariCascading Style Sheets CSS digunakan untuk menentukan style dari tiap element dalam dokumen HTML. Menghasilkan kemungkinan untuk memisahkan antara layout dan style sebuah halaman web dari data atau informasi. CSS mampu menata style tipe fonts, ukuran font, letter spacing, warna, border, dan margin. Halaman tanpa CSS <html <head <title!ld School<"title <"head <body <font face#arial si$e#%&'ample Head<"font<br <p<font si$e#(Main te't here.<"font<"p <font face#arial si$e#%)nother Head<"font<br <p<font si$e#(More te't here.<"font<"p <"body <"html )lasan *enggunaan CSS +ayangkan anda menata situs yang memiliki -- halaman. +oss anda ingin mengubah warna font dari sub udul di tiap halaman. /ika di tiap halaman rata0rata mempunyai 1 sub udul. Tag HTML yang harus dirubah 1 ' -- # 1-- tag HTML +agaimana ika bos anda berubah pikiran2 CSS memberikan kemudahan kepada desainer untuk mengubah style elemen HTML dengan satu perubahan sa a. Cascading berarti de3nisi style dari elemen HTML akan mempengaruhi elemen HTML lain di dalamnya.

Upload: aris-suryatno

Post on 04-Oct-2015

244 views

Category:

Documents


0 download

DESCRIPTION

CSS

TRANSCRIPT

TEORICSSCSS adalah kependekan dari Cascading Style SheetsCSS digunakan untuk menentukan style dari tiap element dalam dokumen HTML.Menghasilkan kemungkinan untuk memisahkan antara layout dan style sebuah halaman web dari data atau informasi. CSS mampu menata style tipe fonts, ukuran font, letter spacing, warna, border, dan margin.Halaman tanpa CSS Old School Example Head
Main text here. Another Head
More text here.

Alasan Penggunaan CSS Bayangkan anda menata situs yang memiliki 100 halaman. Boss anda ingin mengubah warna font dari sub judul di tiap halaman. Jika di tiap halaman rata-rata mempunyai 5 sub judul. Tag HTML yang harus dirubah 5 x 100 = 500 tag HTML Bagaimana jika bos anda berubah pikiran? CSS memberikan kemudahan kepada desainer untuk mengubah style elemen HTML dengan satu perubahan saja.

Cascading berarti definisi style dari elemen HTML akan mempengaruhi elemen HTML lain di dalamnya.Contoh. Mengaplikasikan warna merah pada tag akan mempengaruhi elemen lain di dalamnya seperti .CSS dapat ditulis di dalam dokumen HTML atau disimpan dalam file terpisah sehingga dapat digunakan untuk beberapa halaman HTML yang berbeda.Styles dapat diaplikasikan secara external, internal, or inline. Aplikasi CSS eksternal lebih menguntungkan dibanding dengan internal/inline.

Implementasi CSS Pertama, buat halaman HTML. Gunakan tag-tag yang umum seperti , , dll. Pada bagian , tambahkan: Buat sebuah file text baru (namai dengan ekstensi .css) Mengisi file .css dengan selector dan style

Selector ditentukan oleh style yang disusun oleh kumpulan propertise Semua komponen tag pada halaman HTML yang menggunakan CSS ini akan berwarna biru dan berukuran 18px Selector: bisa berupa HTML element. Contoh p { color:red; }p adalah selector. Semua huruf dalam tag akan berwarna merah

File HTML tanpa CSSFile HTML dengan CSS

Selectors: Class Kita dapat menciptakan class, sebagai bagian dari tag HTML.

Selectors: Class Selector berupa class boleh tidak dibuat tanpa tag. Sehingga bisa diaplikasikan ke dalam banyak tag html.

Selectors: ID Selector berupa ID digunakan secara tunggal. ID mendefinisikan nama instance dari sesuatu

Selectors: Contextual Selector contextual disusun oleh dua atau lebih selector yang dipisahkan oleh spasi. Selector ini akan menampilkan text dalam sebuah dengan background kuning; pada tempat yang lain tidak akan terpengaruhi

Selectors: Pseudo Classes Menentukan keadaan dari suatu selectors, seperti tag link saat dalam keadaan hover, visited dan active.

Komentar juga perlu di CSS/* This is a comment */