Show Mobile Navigation

April 29, 2013

,

Apa itu CSS ?

Unknown - Monday, April 29, 2013

Apa Itu CSS ? kita mungkin sering mendengar Istilah ini . Bagi Para pelaku Web atau blog , CSS merupakan makanan sehari-hari mereka dalam membuat atau mendesain tampilan Web atau Blognya. Namun tahukah anda Arti dari CSS itu sendiri. CSS sendiri merupakan kependekan dari Cascading Style Sheets (CSS)  yang secara bahasa memiliki arti Lembaran yang memiliki gaya seperti Air terjun yang mengalir. Namun dalam istilah Web atau Blog CSS memiliki arti lain dalam menerjemahkan arti CSS ini. 

Dalam sebuah Artikel di situs Wikipedia 
"CSS merupakan aturan untuk mengendalikan beberapa komponen dalam sebuah web sehingga akan lebih terstruktur dan seragam. Namun CSS bukan merupakan bahasa pemograman.

Sama halnya styles dalam aplikasi pengolahan kata seperti Microsoft Word yang dapat mengatur beberapa style, misalnya heading, subbab, bodytext, footer, images, dan style lainnya untuk dapat digunakan bersama-sama dalam beberapa berkas (file).[1] Pada umumnya CSS dipakai untuk memformat tampilan halaman web yang dibuat dengan bahasa HTML dan XHTML.[1]

CSS dapat mengendalikan ukuran gambar, warna bagian tubuh pada teks, warna tabel, ukuran border, warna border, warna hyperlink, warna mouse over, spasi antar paragraf, spasi antar teks, margin kiri, kanan, atas, bawah, dan parameter lainnya.[1] CSS adalah bahasa style sheet yang digunakan untuk mengatur tampilan dokumen.[2] Dengan adanya CSS memungkinkan kita untuk menampilkan halaman yang sama dengan format yang berbeda"


 Dalam penjelasan Wikipedia ini, bisa kita ambil kesimpulan bahwa sebenarnya CSS sendiri merupakan kumpulan kode-kode yang terdapat dalam sebuah Web atau Blog yang berfungsi sebagai Pengatur dan mengendalikan Komponen-komponen yang terdapat dalam sebuah Web atau Blog. Tujuannya tentu saja agar Tampilan Web atau Blog menjadi Lebih Seragam , Rapih dan Terstruktur.

Bagi anda yang ingin belajar dalam hal membuat , mendesain dan memodifikasi suatu Web atau Blog . Mempelajari CSS merupakan suatu keharusan . jika kita analogikan dalam membangun sebuah rumah , kita tidak hanya mempelajari tentang cara membangun dan Bahan-bahan bangunan saja. Tapi kita juga harus mempelajari tentang mempercantik rumah seperti pemilihan warna Cat ,pengaturan ruangan ,dan lainnya agar pemiliknya merasa betah .sama seperti halnya Rumah, web juga perlu dipercantik agar para  pengunjung merasa betah berkunjung Di Web atau Blog anda. 

Versi CSS
Untuk saat ini terdapat tiga versi CSS, yaitu CSS1, CSS2, dan CSS3. 
CSS1 hanya berpusat pada pemformatan dokumen HTML saja.
CSS2 Mengalami perkembangan  sehingga memungkinkan dokumen agar bisa ditampilkan di printer
CSS3 adalah versi terbaru dari CSS yang mampu melakukan banyak hal dalam desain website. CSS3 mendukung penentuan posisi konten, downloadable, huruf font, tampilan pada tabel /table layout dan media tipe untuk printer. Kehadiran versi CSS yang kedua diharapkan lebih baik dari versi pertama dan kedua.

CSS3 juga dapat melakukan animasi pada halaman website, diantaranya animasi warna hingga animasi 3D. Dengan CSS3 desainer lebih dimudahkan dalam hal kompatibilitas websitenya pada smartphone dengan dukungan fitur baru yakni media query. Selain itu, banyak fitur baru pada CSS3 seperti: multiple background, border-radius, drop-shadow, border-image, CSS Math, dan CSS Object Model

Dasar Penulisan CSS
dalam hal mempelajari CSS kita harus mengenal beberapa komponen wajib yang terdapat pada CSS .untuk lebih jelas perhatikan Kode di bawah ini.

Header { 
               background : #000000 ;
               }

- Header diatas adalah sebagai Selector , yang artinya adalah bagian ataupun elemen mana yang akan kita atur Style-nya.
- Tanda {} ini adalah sebagai Declaration yang mengapit dua unsur yaitu Properti dan Value(nilai)
- Background di atas adalah sebagai Properti , yang artinya adalah Komponen yang kita butuhkan dalam mengatur Style-nya.
- Lalu kode #000000 ini merupakan Value atau Nilai yang berati nilai dari declaration yang kita butuhkan .

Beberapa Metode dalam Penulisan CSS 
1.Inline Style Sheet , Dalam metode ini penulisan atribut CSS bisa langsung dilakukan di dalam HTML yang di maksud .
Cara penulisannya hanya dengan menambahkan atribut style="..."  ke dalam Tag HTML tersebut .dalam hal ini Style hanya berpengaruh pada HTML yang bersangkutan dan tidak berpengaruh kepada HTML lainnya.Sebagai Contoh perhatikan Kode d bawah ini 
<p id="Contoh 1">
Ini adalah contoh tag P tanpa diformat menggunakan CSS </p>

<p id="Contoh2" style="font-size:20pt">
Tag P ini diformat dengan CSS dengan besar font 20 point </p>

Contoh 1 adalah Tag P yang tidak dimasukan atribut CSS dan contoh kedua contoh Tag P yang dimasukan Atribut CSS.

2 Embedded Style Sheet ,adalah cara penulisan yang terlebih dahulu menggunakan tag <style> ... </style> dan terletak di atas kode<body> atau diantara kode <head>dan </head>.dalam cara metode ini disebutkan atribut-atribut CSS yang akan digunakan untuk tag HTML-HTML tersebut. yang selanjutnya akan di gunakan oleh HTML yang di maksud.
Contoh Penulisan CSS dengan menggunakan Metode Embedded Style Sheet .
<html>
<head>
<title>Contoh Bentuk Embedded</title>
</head>
<style>
body {background:#FFFFFF; color:#333333; margin-left:0.5in}
h1 {font-size:18pt; color:#999999}
p {font-size:12pt; font-family:arial; text-indent:0.5in}
</style>

<body>
<h1 id="Contoh1">Judul ini berukuran 18 dengan warna Hitam!</h1>
<p id="Contoh2">Tag p ini di format dengan besar font 12 point dengan tipe font Arial dan mempunyai identasi 0.5 inch </p>
<p id="Contoh3">Yang perlu diperhatikan juga bahwa body disini telah diformat dengan margin kiri 0.5 inch dan warna background putih</p>
</body>
</html>

Sifat CSS
CSS memiliki 2 sifat yaitu CSS Internal dan CSS Eksternal ,
1. CSS Internal ,yaitu Script CSS yang di tulis langsung di dalam sebuah Web atau blog yang yang bersangkutan .namun pengunaannya hanya berlaku hanya pada halaman Web yang di maksud saja. jika seandainya anda membuat halaman Web lain yang akan anda desain dengan model yang sama.anda tetap harus memasukan Script CSS tersebut ke dalam halaman web lain itu.

2.CSS Eksternal, yaitu script CSS tersebut  di tulis dalam berkas khusus yang ber-ekstensi .CSS . dan di pisahkan dan di letakan di tempat khusus atau di luar situs web itu sendiri.setelah itu anda tinggal menambahkan kode pemanggil CSS di bawah kode <head>.
Contoh penulisan kode pemanggil CSS.


<link href="http://namaccsmu/style/cssku.css" rel="stylesheet" type="text/css" media="screen"></link>

Perhatikan kode warna merah. itu merupakan URL berkas CSS yang akan dimasukan kedalam web anda .

saat ini cukup banyak situs-situs yang menyediakan Hosting penyimpan berkas CSS .salah satunya yaitu Google Code atau situs-situs lainnya.


Mungkin Cukup sekian artikel saya mengenai Apa Itu CSS ? dan mungkin di lain kesempatan saya akan memberikan artikel dan tutorial-tutorial mengenai CSS lebih jauh dan lebih terperinci lagi .





Refrensi : Wikipedia  ,SpiderBeat.com 

0 komentar:

Post a Comment