Learn Basic CSS With OFFICIALFCA Part 3



Hey Hey walkambek with me ./CR0T_D1LU4R Jadi disini gua mau lanjut Pembelajaran soal css kemarin yah

untuk kalian yang belom lihat tutorial sebelumnya bisa lihat disini cuk Tutor Part 2 & Tutorial Part 1

Nah skrng kita bahas soal  komputer pada syle css yah gaes

- Komentar With Style Css 

Anda dapat menambahkan comentar pada style sheet, Komentar klean dapat di tulis pada garis manapun dalam spesifikasi style di antara tanda /* & /* contoh
Buatlah Seperti Source Code ini / Copy Paste Juga Boleh :v
H1 {font: 20pt/22pt

bold; color=#00ff00} /* OFFICIALFCA Warna Ijo Buat Head */

Nah cukup mudah & simple kan cuk ? 


Oke skrng kita lanjut ke berikutnya yah kita skrng ada di bagian

- Nesting 

Nesting itu apa si bang ? Oke gua sedikit jelasin yah Nesting itu bila document HTML yang di buat strucktur yang bae, klean tydak perlu repot-repot membuat banyak Class & ID dikarenakan klean juga dapat mendifinisikan CSS dengan cara penulisan Selector dalam Selector (NESTING)

Contoh:
Buatlah Seperti Source Code ini / Copy Paste Juga Boleh :v


#top {background-color: #ccc; padding: 1em}
#top h1 {color: #ff0;}
#top p {color: red; font-wight:bold} 

nah cuk code di atas itu berarti jika ada Tag

dan tag

 pada sebuah block dengan id="top", maka ketentuan dalam code CSS di atas akan berlaku. Namun jika tag 

&

 tersebut di luar block dengan id="top", makan ketentuan di dalam code CSS di atas tydak berlaku.

nah mungkin seperti itu kurang lebih nya cuk sekarang kita lanjut okey.

- Pseudo Clases

Pseudo Clases
digunakan untuk menambahkan effect special yah kaya martabak :v pada SELECTOOR-SELECCTOR tertentu. pada CSS, Pseudo  Class bisa juga dikombinasikan dengan Class & Tydak semua Pseudo Class  komnpatibel dengan setiap browser. untuk lebih menjamin Pseudo Class berjalan dengan baik, pastikan dimasukan pada baris paling atas code HTML, 

Nah ini contoh berikut: 


Sumber Pict By: Buku Programer WEB Thanks To: Priyanto Hidayatullah & Jauhari Khairul Kawasitara & Informatika Bandung 


Oke Guys sekarang kita lanjut ke berikut nya <3

- Link
Bang maksudnya Link itu gmna ? guna nya apa ? oke jadi dsini gua jelasin sedikit dulu yah, Implementasi Style Sheet juga memungkinkan klean untuk mengubah penampilan dari Link (Teks yang di klik oleh user untuk melompat ke halaman lain) dengan memberikan dua Class yang telah di definisikan pada tag


  • a:link mennunjukan link yang belom di kunjungin
  • a:visited \menunjukan link yang telah di klik/dikunjungi oleh user 
  • a:hover menunjukan link ketika di lewati cursor
  • a:active menunjukan link ketika memperoleh fokus 
klean juga bisa mengatur sejumlah properti termasuk Color , Font-Size, Font-weught * text-decoration

Catatan:

  1. a:hover harus berada setelah a:link & a:visited pada definisi CSSnya supaya Code nya bisa berjalan
  2. a:active harus berada setelah a:hover supaya code nya bisa berjalan
    3.nama Pseudo-Class tidak Case-Sensitive

Contoh:

A:link {color: red}
A:visited {color: blue}
A:hover {color: yellow}
A:active {color: orange}

Dengan menambahkan Text-Decoration "none" menghilangkan garis bawah pada text link

A:visited {color: blue; text-decoration: none}

Contoh:
Buatlah Seperti Source Code ini / Copy Paste Juga Boleh :v
    
      FRI3NDS CYBER ARMY
     
 
 
   

OFFICIALFCA 2K18

   

Lear Basic CSS Part 3 With ./CR0T_D1LU4R

 
 

nah nanti jadi nya seperti ini guys <3

nah kalo sudah kalian masukan sekarang buat CODE CSS yah gaes  

contoh:

Buatlah Seperti Source Code ini / Copy Paste Juga Boleh :v

.wrapper{
width:800px;height:auto;background-color:#999999;
}
.header{
width:1460;height:600px;background-image:url(../images/3.png);
}
.left{
width:600px;height:20px;background-color:yellow;float:left;
}
.right{
width:600px;height:20px;background-color:#0033ff;float:left;
}
.footer{
width:600px;height:20px;background-color:red;clear:left;
}
nah code nya kalian simpen dengan extensi.CSS disini saya save dengan nama fca.css nah mari kita lanjur ya gaes
sekarang kita buat script HTML dan menggabungkan ke dalam file CSS yang udah kita bikin tadi yah gaes

contoh:

Buatlah Seperti Source Code ini / Copy Paste Juga Boleh :v

 
      OFFICIALFCA 2k18
     
   

 

 
FRI3NDS CYBER ARMY

 
OFFICIALFCA 2k18

 
Learn CSS Basic By ./CR0T_D1LU4R

 
   





nah kalo sudah save dengan extensi HTML nanti jadi nya akan seperti ini guys 


nah kurang lebih seperti itu gaes yah karna ini buat tutorial jadi simpel aja ye kan seng penting bisa :v

nah mungkin cukup sekian tutorial dari gua ./CR0T_D1LU4R yang paling HANDSOME People In The World  


Mungkin besok / lusa akan ada tutorial terbaru dari mimin yang handsome ini guys

Join With Me Touched Me

Support me by subscribe to my Youtube Channel Touch here

#AUTHOR ./CR0T_D1LU4R