Hai sahabat adventura, hari ini ane balik lagi nie. Bersama dengan sebuah lagu dari Last Child - Tak Pernah Ternilai. Hehehe, tapi bukan itu yang mau kita bahas, melainkan dasar CSS. Yup, CSS itu apa sih?
Cascading Style Sheet (CSS) merupakan aturan untuk mengendalikan beberapa komponen dalam sebuah web sehingga akan lebih terstruktur dan seragam.
(copas dari : http://id.wikipedia.org/wiki/Cascading_Style_Sheets)
Nah berikut tampilannya
masih sederhana banget ya, untuk Tutorial yang lebih advancenya bisa di download di blog dosen ane http://blog.rosihanari.net/ disitu komplit - plit kalo pengen belajar programming, terutama PHP.
Ini untuk download sourcenya ya :D
#kotak{
width:800;
margin:0 auto;
}
didepan tulisan kotak ditulis # karena merupakan id, jika class maka didepannya di tulis .kotak
Oh iya, setelah temen2 menulis
<div id="kotak">
biasakan menutup dengan
</div>
menurut http://kangtanto.com/web-2/css-web-2/pengenalan-id-dan-class-pada-css
bedanya id dan class, id hanya digunakan sekali pada komponen yang unik misal, footer, header, dll
sedangkan class digunakan untuk komponen2 yang selalu diulang - ulang misalnya pada paragraf, title dan heading.
kemudian di dalam style terdapat padding dan margin yang bedanya
padding untuk mengatur batas dalam komponen, misalnya mengatur jarak heading dengan gambar
margin untuk mengatur batas luar komponen kanan, kiri, atas, bawah.
Sudah jelaskah?
kalo belum yuk, koment - koment dibawah ini ya :)
Salam adventura :D
Cascading Style Sheet (CSS) merupakan aturan untuk mengendalikan beberapa komponen dalam sebuah web sehingga akan lebih terstruktur dan seragam.
(copas dari : http://id.wikipedia.org/wiki/Cascading_Style_Sheets)
Nah berikut tampilannya
masih sederhana banget ya, untuk Tutorial yang lebih advancenya bisa di download di blog dosen ane http://blog.rosihanari.net/ disitu komplit - plit kalo pengen belajar programming, terutama PHP.
Ini untuk download sourcenya ya :D
Oke sedikit kita mengulas ya coy, disitukan ada dua file satunya style yang berisi file cssnya, dan satunya css yang berisi codingannya.
<link rel ="stylesheet" type="text/css" href="style.css"/>
berfungsi untuk menhubungkan antara file css.html dengan style.css
<div id="kotak">
div berfungsi untuk membagi - bagi tampilannya jadi beberapa bagian, nah itu div dengan id kotak, berarti kita sudah memiliki satu komponen dasar namnya kotak. Terus di dalam div kotak dibagi lagi
<div id="header">, <div id="navigasi">, <div id="isi">, <div id="footer">
Nah intinya ada 1 kotak terus dipotong jadi 4, keliatan kan entu kayak digambar.
Id ini bukan sembarangan jadi nama id harus menyesuaikan dengan file cssnya, kalo di situ namanya style.css
misalnya <div id="kotak"> maka di dalam cssnya akan terdapat bagian seperti berikut
width:800;
margin:0 auto;
}
didepan tulisan kotak ditulis # karena merupakan id, jika class maka didepannya di tulis .kotak
Oh iya, setelah temen2 menulis
<div id="kotak">
biasakan menutup dengan
</div>
menurut http://kangtanto.com/web-2/css-web-2/pengenalan-id-dan-class-pada-css
bedanya id dan class, id hanya digunakan sekali pada komponen yang unik misal, footer, header, dll
sedangkan class digunakan untuk komponen2 yang selalu diulang - ulang misalnya pada paragraf, title dan heading.
kemudian di dalam style terdapat padding dan margin yang bedanya
(gambar dari http://gaptek32.blogspot.com/2012/12/perbedaan-dari-fungsi-margin-dengan.html)
padding untuk mengatur batas dalam komponen, misalnya mengatur jarak heading dengan gambar
margin untuk mengatur batas luar komponen kanan, kiri, atas, bawah.
Sudah jelaskah?
kalo belum yuk, koment - koment dibawah ini ya :)
Salam adventura :D
Comments
Post a Comment