Mengenal lebih dalam apa itu CSS dan Cara penggunaanya -->

Mengenal lebih dalam apa itu CSS dan Cara penggunaanya

Advertisement



Advertisement


css3 logo
      Pastinya sering kali kita melihat sebuah website yang berpenampilan bagus dan tampak lebih elegan dari segi tampilan dan penempatan, itu semua juga dibangun dengan CSS dan HTML dengan sedikit tambahan JQuery, Silahkan berkenalan : Pengertian JQuery dan fungsinya .

CSS, kata yang tidak asing lagi bagi para web developer dan semacamnya. CSS merupakan kepanjangan dari Cascading Style Sheet yang fungsinya untuk menghias suatu tampilan layout / halaman sebuah tampilan website menjadi lebih enak dipandang / menarik .

Dari CSS pula, membuat pengunjung nyaman dan berakibat meningkatnya pageview kita, itu semua juga tergantung pada si pembuat kodenya .

Seiring bertambahnya jaman, Sekarang saja sudah keluar versi CSS terbaru yaitu CSS3 yang dimana dia menekankan sebuah animasi warna hingga 3D .

Contoh cascading style sheet :
div{
padding:0;
margin:0;
color:grey;
}

Pada bagian sebelum tanda {} merupakan sebuah selector ( Memahami apa itu Selector pada JQuery ), dan yang ada didalam tanda {} itu merupakan property dan value .

Jenis penggunaan cascading style sheet


1. CSS pada tag HTML atau Inline style sheet .
<div style="text-align:center; color:white; 
background-color:red;font-family:arial, sans-serif">indonesiakode.blogspot.com</div>
Cara ini biasanya digunakan jika kode cssnya sedikit .

2. CSS di dalam tag  <head> / embedded style sheet .
<head>
<style>
.headC{
color:#fff;
font-family:SEGOU UI;
background:blue;
padding:10px 20px;
}
</style>
</head>
Cara ini menempatkan kode stylesheet ke bagian <head>, tepatnya dibawah tag </title>. Seperti contoh di atas yang menggunakan selector .headC yang ada pada tag </style> dan cara pemanggilan pada HTML adalah :
<div class="headC"></div>
// dikarenakan menggunakan class bukan id

Perlu diingat !

CSS mempunyai sebuah selector dan mempunyai 2 jenis, yaitu pagar(#) dan titik(.). Dalam artian, pagar itu disebut id dan titik itu disebut dengan class, sebagai contoh kodenya :
.coba1{
color:#fff;
}
Pada selector .coba1 itu merupakan class .
#coba-2{
color:red;
}
Pada selector #coba-2 merupakan sebauh id tag, contoh HTMLnya : <div id="coba-2"></div> .

Semoga tidak ada kesalahan dalam penulisan id dan class pada CSS .

Itulah sedikit penjelasan dan pengertian serta cara penggunaan kode CSS yang ditulis oleh indonesiakode .Sekarang, Ciptakan website dengan tampilan sebagus mungkin .

Semoga bermanfaat .
Advertisement


Advertisement
LihatTutupKomentar