Mengenal CSS | Blog Mas Deddy

BLOGING

CSS

X

BLOGING

CSS

Mengenal CSS

CSS-Syntax
CSS Syntax
Syntax bisa diartikan sebagai bentuk kode. Jadi Syntax CSS bisa berarti bentuk kode CSS. Kode CSS berbeda dengan kode HTML.

Kode CSS hanya dibagi menjadi 3 bagian, yaitu selector, property, dan value.

CSS Syntax
CSS Syntax

selector { property : value; }
Selector adalah elemen HTML yang akan diberikan style.
Property adalah atribut dari suatu elemen HTML yang ingin anda tentukan stylenya, sedangkan
Value adalah nilai dari atribut tersebut.
body { background-color:#cccccc; font-family: "Calibri", Verdana, Tahoma; }
Kode CSS diatas bisa berarti elemen body (tag <body>) akan ditampilkan dengan warna background abu-abu (#cccccc adalah kode warna untuk abu-abu), dan pada perintah berikutnya kita menentukan agar elemen body menggunakan font Calibri.

Jika font Calibri tidak ada pada komputer user, maka gunakan font Verdana, begitu seterusnya.
Penulisan font Calibri menggunakan petik dua adalah karena font Calibri bukan merupakan font standart dalam CSS.
Font yang tidak standart dalam CSS sebaiknya diberi tanda petik dua. Font yang namanya terdiri lebih dari satu kata juga harus diberikan tanda petik, misal “Times New Roman”.

Inheritance (Pewarisan)
Maksud dari Interitance pada CSS adalah begitu kita memberikan style pada elemen body, maka elemen yang didalamnya akan mengikuti style dari elemen body kecuali elemen tersebut diberi style tertentu.
<html>
<head> 

<title>Syntax CSS</title> 
<style type="text/css"> 
body { 
background-color:#cccccc; 
font-family: "Calibri", Verdana, Tahoma; 
} 
</style>
</head> 
<body> 

<h1>Semangat Pagi</h1> 
<p>paragraf</p> 

</body> 
</html>
Dari contoh kode diatas, kita memberikan style pada elemen body (tag <body>).

Dengan begini, maka tag-tag HTML yang ada diantara <body> dan </body> yaitu (tag <h1> dan tag <p>) akan mengikuti style <body>, yaitu memiliki warna latar abu-abu dan menggunakan font Calibri.

Demikian Mengenal CSS semoga bisa menambah wawasan dan pengalaman Anda

Senin, 09 Juli 2018

-- SHARE IT --


Silahkan tinggalkan komentar Anda
SESUAI JUDUL ...!!
NO SPAM PLEASE ...!!