Rabu, 29 November 2017

Definisi CSS ( Cascading Style Sheet ) menurut Pakar web By MR T-Rex

Definisi CSS ( Cascading Style Sheet )

Definisi CSS ( Cascading Style Sheet ) atau sering disebut (Cascading Style Sheet.) yaitu style yang digunakan untuk menampilkan elemen HTML yang dapat mengatur atau mengontrol tampilan halaman web serta memisahkan antara tampilan dan konten halaman web Bukanlah suatu keharusan dalam membuat web, akan tetapi menggunakan CSS akan membuat tampilan halaman web menjadi lebih cantik dan menarik ketika seorang pengunjung melihatnya.
Setelah anda sudah mengetahui tentang Definisi CSS ( Cascading Style Sheet ), kita bisa melihat cara penulisannya sebagai berikut :
Pengenalan Scriptnya

h1 {color:blue;}

Script CSS terdiri atas 2 komponen, yakni Selector & Declaration.
•Selector berfungsi untuk memberitahu browser bahwa pada elemen mana rule CSS diterapkan atau bisa dilihat ( H1 ).
•Selector dapat berupa elemen HTML, selector class atau selector id.
•Declaration merupakan aturan CSS yang diterapkan, terdiri atas property dan value contoh di atas {color:blue}.
Cara Penulisan CSS (Inline Style)
kita bisa langsung menambah kan kode CSS kedalam tag HTML nya dibawah ini
contoh

Cara Penulisan CSS (External Style
Menggunakan tag untuk merujuk ke file css khusus yang telah dideklarasikan.

Sintaks CSS
CSS sintaks standar
body {color:black}
•Jika value lebih dari satu kata gunakan tanda kutip“”
p {font-family:”sansserif”}
•Jika lebih dari satu properti untuk sebuah selektor
p {text-align:center;color:red}
•atau, agar lebih mudah dilihat bisa ditulis seperti ini:
p {
text-align:center;
color:black;
font-family:arial
}
Grouping
Untuk mempersingkat penulisan, CSS juga memungkinkan untuk melakukan grouping pada selector‐selector yang memiliki property yang sama.
contoh:
h1 { color:green; }
h3 { color:green; }
h5 { color:green; }
p { color:green; }
digrouping menjadi:
h1,h3,h5,p { color:green; }
CSS Class Selector
Berfungsi untuk memberikan style yang berbeda pada sebua helemen HTML
•Diawali dengan menambahkan tanda‘.’(titik) pada file css
•Padafile HTML ditambahkan property ‘class’untuk memanggil selector tersebut.
•Satu elemen HTML dapat memanggil lebih dari satu class
contoh:
.merah{color:red;}
.right {text-align:right;}
.left {text-align:left;}

CSS Dimension
Berfungsi untuk mengatur panjang dan lebar dari sebuah elemen HTML.
•contoh:
height:100px;
width:200px;
•Nilai/ value
CSS Box Model
Sebuah elemen HTML dapat kita anggap sebagai sebuah box/ kotak.
•Digunakan pada saat kita akan merancang tampilan sebuah website.
•Pada dasarnya berfungsi sebagai tempat yang membungkus isi dari elemen‐elemen HTML.
•Tag yang biasanya digunakan untuk merancang tampilan adalah
, walaupun tag lain juga bisa menerapkan box model.
•Terdiri atas 4 bagian: Margin, Border, Padding, Content.Contoh scriptnya CSS Margin dibawah ini


CSS FloatBerfungsi untuk memaksa sebuah elemen menjadi berada dikiri atau dikanan halaman.
•Elemen yang berada setelah elemen yang diberi float akan terpengaruh fungsi float tersebut.
•Elemen yang berada sebelum elemen yang diberi float tidak akan terpengaruh.
•Property:
•float:left;
•float:right;
•Untukme‐nonaktifkanfungsifloat gunakan:
•clear:both;
•Biasanya digunakan untuk membuat gallery.CSS Pseudo‐Class •Berfungsi untuk memberikan efek yang berbeda pada sebuah selector.
•Biasanya digunakan untuk link / anchor.
•Property:
•:link{color:red;}
•:visited{color:blue;}
•:hover{color:green;}
•:active{color:orange;}
•contoh:
a:hover
{
color:red;
text-decoration:underline;
}
Demikian Definisi CSS ( Cascading Style Sheet ) dan cara penulisannya semoga bermanfaat

Tidak ada komentar: