Mengenal Cascading Style Sheet (Css) Dan Cara Menggunakannya

CSS Singkatan dari Cascading Style Sheet.

CSS Merupakan Salah Satu Bahasa Pemograman yang di gunakan untuk mempercantik dan mengatur Layout halaman web biar lebih elegan dan menarik.

CSS yaitu sebuah teknologi internet yang direkomendasikan oleh World Wide Web Consortium atau W3C pada tahun 1996. Awalnya, CSS dikembangkan di SGML pada tahun 1970, dan terus dikembangkan sampai ketika ini. CSS telah mendukung banyak bahasa markup menyerupai HTML, XHTML, XML, SVG (Scalable Vector Graphics) dan Mozilla XUL (XML User Interface Language).

Pada desember 1996, W3C memperkenalkan Level 1 spesifikasi CSS atau juga dikenal CSS1 yang mendukung format, warna font teks, dan lain-lain. Kemudian, Mei 1998, W3C menerbitkan CSS2 yang di dalamnya diatur fungsi peletakan elemen. Dan sekarang, W3C telah memperbaiki dan meningkatkan Kemampuan CSS2 ke CSS3.

CSS dipakai oleh web programmer dan juga blogger untuk memilih warna, tata letak font, dan semua aspek lain dari presentasi dokumen di situs mereka. Saat ini, hampir tidak ada situs web yang dibangun tanpa isyarat css. Kalo Kata Kata - Kata nya "You are the css in my html" wkwkwk.

Pengenalan Dasar :

Cascading Style Sheet terdiri dari Selektor, deklarasi, Properti dan Nilai. Seperti pada HTML, PHP dan bahasa pemrograman lainnya, CSS juga mempunyai hukum yang menulis itu sendiri.

Contoh penulisan isyarat css :

Body {background-color: white;}

‘Body’ yaitu Selektor, ‘{ }’ yaitu deklarasi, ‘background-color’ yaitu properti dan ‘white’ yaitu nilai. Maksud dari isyarat diatas yaitu mengatur warna latar belakang (background color) dari tag ‘Body’ sebuah halaman web.

Bagaimana Cara menggunakannya Kak?

Nah, untuk Menggunakan CSS ada Berbagai cara. Yuk, simak dan ikuti cara - cara berikut :

1. CSS sebagai atribut/elemen/bagian dari html.

pola souorce code :

</div>

2. Dalam Tag Style. Biasa nya tag ini ada di atas tag </head>

contoh source code :

body{

//Untuk Mendesain Bagian Body

}

</style>

3. CSS dengan File terpisah .

contoh source code :

Kode pada gambar diatas yaitu isyarat html untuk memanggil isyarat css yang terpisah. Kode itu biasanya diletakkan dibawah elemen <title></title> pada sebuah file html. Dalam cara 3 ini, isyarat css berada pada file .css yang dibentuk dengan cara yang sama yaitu dengan sofware notepad, namun diberi format .css.

Untuk Latihan cara 3 ini silahkan anda buat folder. Dalam folder itu anda buat lagi file .html, contohnya latihan.html . Lalu buat file css-nya contohnya style.css.

Dalam file latihan.html, silahkan ketikkan isyarat dibawah ini :

<html>
<head>
<title>Latihan</title>
<link rel=”stylesheet” href=”style.css” type=”text/css”/>
</head>
<body>
<div class=”download”>
<a href=”#”>Download</a>
</div>
</body>
<html>

Simpan, kemudian buka di browser. File .html anda belum dihias alasannya kita belum menambahkan isyarat css kedalam file style.css. Jadi, silahkan masukkan isyarat menyerupai dibawah ini, tentu anda bisa merubah-rubahnya :

.download {
padding:5px 20px;
background:#000;
border:1px solid auto;
text-transform:uppercase;
font-size:20px;
}

sehabis itu simpan, kemudian refresh file latihan.html yang sedang dibuka di browser selamat mencoba .

bagi anda yang ingin mengenal css lebih dalam. Silahkan download E-Book CSS di bawah ini :

E - Book CSS Download disini -> http://adf.ly/1fI3MU
Semoga Bermanfaat #HappyCoding.