Dalam mempelajari CSS ada beberapa hal yang harusnya sudah kita kuasai, antara lain:
-pertama yang pasti bisa menggunakan Browser (Mozzila Firefox, Opera, IE, ataupun lainnya)
-bisa atau mengerti menggunakan webserver local (XAMPP, WAMP, atau lainnya)
-bisa atau mengerti xHTML
-terakhir bisa atau mengerti menggunakan teks editor (Notepad, notepad++, HTMLeditor dll)
jika kita merasa sudah memenuhi syarat di atas, selanjutnya adalah mengenal lebih dekat tentang CSS. setahu penulis CSS dapat di pasang atau di tempatkan pada code halaman xHTML dengan tiga cara yaitu :
1. Inline
2. Embedded (tempel)
3. Exsternal
Penulisan kode dengan cara inline adalah dengan langsung menyisipkan kode (style CSS) pada baris kode atau tag xHTML yang ingin deberikan style (properti),misalnya :
......
<body>
<h1 style=“color:blue”>CSS inline test doang </h1>
.......
Penulisan kode dengan cara embeded adalah dengan menyisipkan kode diatara tag <head>...</head> dengan maksud memformat halaman secara keseluruhan (hanya terbatas pada halaman yang di embedded),contoh penulisannya seperti berikut :
<html>
<head><title>Contoh css embedded</title>
<style type="text/css">
hr {color: red}
p {margin-left: 20px}
body {background-image: url("images/back40.gif")}
</style>
</head>
......
Cara yang ketiga adalah dengan cara file external, maksudnya adalah kita membuat sendiri file .css dan di simpan dengan terpisah degan file html. kalau file nya terpisah,terus bagaimana halaman bisa terformat??
seringkali pertanyaan seperti itu muncul, padahal jawabannya sangat mudah,yaitu kita hanya perlu memberikan link (ditulis di antara tag <head>...nama file ***.css</head>), kalau masih bingung bisa lihat contoh berikut :
kode ini di simpan dengan akhiran .htm
<html>
<head>
<title>contoh css external</title>
<link rel="stylesheet" href="mystyle.css“ type="text/css" media="screen" />
<style type="text/css" media="screen">
/* <![CDATA[ */ @import url(mystyle.css); /* ]]> */
</style>
</head>
<body>
<h1>Belajar Cascading Style Sheet</h1>
<h2>Pengertian</h2>
<p>CSS kependekan dari Cascading Style Sheet.</p>
<p>CSS merupakan fitur tambahan untuk (X)HTML untuk mengatur format tampilan</p>
<p>Dengan menggunakan CSS, waktu pengembangan halaman web dapat dipercepat.</p>
<h2>Cara Penulisan CSS</h2>
<p>CSS dapat ditulis dengan tiga cara yaitu :
<ul>
<li>Inline</li>
<li>Embed</li>
<li>File eksternal</li>
</ul>
</p>
</body>
</html>
kalau yang berikut di simpan dengan akhiran .css (misalnya mystyle.css)
body { background-color:blue ;}
h1 {font-family :times new romans;font-weight:bold; color:yellow;}
h2 {color:lime; text-decoration:blink;}
p {margin-left: 20px;}
li {text-decoration:underline;font-color:lime;}
Sampai disini berarti anda sudah bisa menggunakan css sederhana melalui 3 cara yaitu inline,Embedded dan file eksternal, untuk kelanjutan dasar-dasar css lainnya akan saya post di blog ini lagi secepatnya. mohon ma'af kalau bahasa saya kurang atau susah di mengerti (namanya juga pemula).
Wassalam
untuk yang inline kayaknya hampir semua blogger
ReplyDeletepernah oprek2, kalau untuk yang import itu disimpen
dimana ya filenya ? apa hrs hosting sendiri ?
quote:
Cara yang ketiga adalah dengan cara file external,
maksudnya adalah kita membuat sendiri file .css
dan di simpan dengan terpisah degan file html.
beberapa yang menggunakan blogskin saya lihat
pada import css semua, kayaknya ini yang hosting berbayar
bisa tolong jelasin ini nggak ?
apa ada hosting gratis yg bisa nyimpen css ?
thx
@Pak hachiko :
ReplyDeletesetahu saya sih yang pake file css external itu adalah yang pake hosting sendiri, namun harus tetap di koneksikan dengan link seperti prosedur di atas,
untuk hosting gratis saya pernah coba di alamat http://www.000webhost.com/