12
http://www.bambangherlandi.web.id

Belajar CSS (cascading style sheet)

Embed Size (px)

Citation preview

Page 1: Belajar CSS (cascading style sheet)

http://www.bambangherlandi.web.id

Page 2: Belajar CSS (cascading style sheet)

CSS (Cascading Style Sheet) Secara singkat adalah sebuah metode yang

digunakan untuk mempersingkat penulisan tag HTML,

Seperti: font, color, text dan table. CSS adalah bahasa style sheet yang

digunakan untuk mengatur tampilan dokumen.

Dikembangkan oleh W3C (World Wide Web Consortium) pada tahun 1996.

Page 3: Belajar CSS (cascading style sheet)

Mempersingkat penulisan tag HTML. Mempercepat proses rendering atau

pembacaan HTML karena tidak terdapat pengulangan penulisan.

Mudah dan cepat dalam me-maintenance. CSS bisa melakukan apa saja yang tidak bisa

dilakukan oleh HTML. Misalnya memberi warna pada input box.

Page 4: Belajar CSS (cascading style sheet)

Inline Style Sheet Perintah CSS diletakkan langsung di dalam

dokumen HTML. <p style="color:#00FF00">Belajar

CSS</p>

Page 5: Belajar CSS (cascading style sheet)

Embedded Style Sheet (dituliskan di dalam body) <style type=“text/css”>

H1 {color: red}

h2 {color: blue; font-family:Verdana; font-size:36px;}

body {background-color:#CCCCCC; font-family:Arial; font-size:12px;}

p {

font-family:Arial;

font-size:10px;

color:#000000;}

</style>

Page 6: Belajar CSS (cascading style sheet)

Linked Style Sheet Diletakkan pada bagian HEAD dari sebuah dokumen

HTML <link href=“website.css” rel=“stylesheet” type=“text/css” >

Contoh isi dari file website.css

body {

font-family: verdana;

font-size: 12px;

background-color: #DEDEDE;

margin-top: 0px;

margin-bottom: 0px;

}

Page 7: Belajar CSS (cascading style sheet)

Penulisan CSS terdiri dari: Selector Property Value

Contoh: body {

background-color: #DEDEDE;

}

Page 8: Belajar CSS (cascading style sheet)

Cara penulisan komentar pada CSS adalah: /* isi komentar */

Page 9: Belajar CSS (cascading style sheet)

Tag/ Elemen HTML Class ID Kontektual Spesificity

Page 10: Belajar CSS (cascading style sheet)

Grouping Inheritance

Page 11: Belajar CSS (cascading style sheet)

Buat sebuah halaman website dengan menggunakan metode LAYOUT dan CSS

Terdiri dari 3 halaman html dan 1 dokumen css

Halaman 1 berupa halaman utama Halaman 2 berupa biodata Halaman 3 berupa kesan belajar CSS Semuanya menggunakan penulisan CSS

Page 12: Belajar CSS (cascading style sheet)

Kupas Tuntas CSS, Dominikus Juju, Elexmedia Komputindo, Bogor, 25 Desember 2006.

Berbagai sumber online dan offline.