Skip to main content

Pengenalan CSS


Pengertian
CSS (Cascading Style Sheet) merupakan suatu bahasa program web yang digunakan untuk mengendalikan dan membangun berbagai komponen dalam web sehingga tampilan web akan menjadi lebih rapi, terstruktur dan seragam.

CSS saat ini dikembangkan oleh World Wide Web Consortium (W3C) dan menjadi bahasa standar dalam pembuatan web. CSS difungsikan sebagai penopang atau pendukung, dan pelengkap dari file html yang berperan dalam penataan kerangka dan layout.(sumber)

Keuntungan Menggunakan CSS

Tanpa CSS pun web dapat dibangun, namun tahukah anda, salah satu kunci kesuksesan web agar banyak pengunjung adalah tampilan yang menarik, interaktif, cepat diakses, dan lain-lain. Jika web sangat lambat di akses, tentu pengunjung juga akan merasa bosan, malah akan menutup browser web mereka, sebelum seluruh informasi dalam web tersebut ditampilkan.

Berikut keuntungan menggunakan CSS :

1.    Memisahkan pembuatan dokumen (CSS dan HTML)
2.    Mempermudah dan mempersingkat pembuatan dan pemeliharaan dokumen web.
3.    Akses Web lebih cepat di-loading (mempercepat pembacaan HTML)
4.    Fleksibel, interaktif, tampilan lebih menarik dan nyaman dipandang.
5.    Ringan pada filesize/Bandwith lebih kecil.
6.    Dapat digunakan pada semua web browser.

Cara Menggunakan CSS

Internal Css

Internal Style Sheet adalah Kode CSS yang Dipasang di dalam tag head html. cara ini akan menjadi sulit apabila kita memiliki banyak halaman web, baca

Contoh :

<html>
<head>
<style type = "text/css">
.header {
width:900px; 
height:50px;
border: 1px solid #640404;
}
.headerLeft {
width:400px;
background-color:#CCCCCC;
height:50px;
float:left;
text-align:center;
}
.headerRight {
width:450px;
background-color:#999999;
height:50px;
float:right;
text-align:center;
}
</style>
</head>
<body>

</body>
</html>

Inline CSS

Merupakan cara pemasangan kode CSS yang langsung di tulis pada tag HTML. Ini adalah salah satu opsi css dimana kita bisa merubah tampilan, bentuk, ukuran, font hanya satu kata, huruf, paragraf ataupun konten yang ingin kita rubah saja, Namun akan sulit bila kita ingin menseragamkan tampilan web kita yang memiliki banyak halaman. 

Contoh

<html>
<head>
<div style="background-color:#999999; text-align:center;">Inline CSS</div>
</head>
</body>
</html>

External CSS

Adalah metode dimana Kode-kode CSS di pisahkan kedalam sebuah file sendiri dengan extention .css, yang nantinya akan di panggil ke halaman HTML.(baca)

Contoh Cara memanggil file css ke Halaman HTML:

<html>
<head>
<link rel=”stylesheet” type=”text/css” href=”public.css”/>
</head>
<body>
</body>
</html>

(sumber)
Sekian pengenalan css ... Terima Kasih
Labels:

Comments

Post a Comment

Popular posts from this blog

Tutorial Instalasi AppServ

Appserv adalah Server Package Software adalah aplikasi yang digunakan untuk menjalankan paket aplikasi Apache Server (localhost), PHP 5, Database MySQL, dan phpMyAdmin untuk manajemen Database MySQL. Berikut saya akan menjelaskan langkah-langkah instalasi Appserv pada Windows. Double Klik di Aplikasi Appserv.exe atau jika belum ada Donwload Appserv disini , jika sudah klik next ... License and Agreement, Atau ketentuan dan perjanjian disini dimana kamu setuju dengan semua ketentuan yang dibuat oleh Appservnetwork dan jika kamu setuju untuk menginstall aplikasi ini klik I agree... yaa kita tau ini gak terlalu di baca  dan mungkin cuma ngeberat-beratin content doank tp biar jelas aja apa gunannya kan ?... OK next Destination Folder , kamu bisa memilih dimana lokasi folder appserv yang akan kamu install. klik next untuk menginstall di defaultnya adalah di "C:\AppServ". Select Components, kamu bisa memilih komponen apa saja yang perlu di install at...
1 comment
Read more

Memanggil file CSS ke Halaman HTML

Postingan sebelumnya saya menjelaskan tentang halaman html sederhana dengan layout CSS , yang mana Script CSS di gabungkan ke halaman HTML, kali ini saya akan menjelaskan bagaimana memisahkan file CSS dan cara memanggil file tersebut di halaman HTML. Pertama lihat kembali ke halaman html, buka dengan editor kamu. <!DOCTYPE html> <html> <head> <style> #header {     background-color:black;     color:white;     text-align:center;     padding:5px; } #nav {     line-height:30px;     background-color:#eeeeee;     height:300px;     width:100px;     float:left;     padding:5px; } #section {     width:350px;     float:left;     padding:10px; } #footer {     background-color:black;     color:white;     clear:both;     text-align:center;     padding:5px...
1 comment
Read more

Perancangan Ruang Server

Perlunya Memiliki Server dan Ruang Server Sendiri A. Alasan Memiliki Server & Ruang Server Sendiri Pembangunan Gedung D pada STT Ibnu Sina akan menambah jumlah user pada fasilitas E-learning dan akses website STT Ibnu Sina lainnya. Hal tersebut tentu akan menambah beban jaringan atau Bandwidth yang dibutuhkan untuk menyimpan content pada E-learning dan Website STT Ibnu Sina, seperti modul tugas dan Data Kemahasiswaan. Berikut beberapa keuntungan jika STT Ibnu Sina memuliki Server dan ruang Server sendiri : Mempermudah baik pihak pengurus STT Ibnu Sina Batam maupun mahasiswa dalam mengatur dan mengakses data dan informasi Kerahasiaan data dan informasi terjaga dalam server. Mengurangi biaya internet karena situs STT Ibnu Sina yang di akses melalui jaringan yang ada di STT Ibnu Sina akan menggunakan jaringan local, sehingga tidak membutuhkan akses internet Mempermudah mahasiswa khususnya teknik informatika untuk belajar langsung tentang server, data center dan kegunaann...
1 comment
Read more