0 Pengenalan Css

CSS adalah bahasa style yang berfungsi untuk memformat document html,format disini dapat diartikan dari mulai pengaturan code maupun pengembangan code,baik dari segi karakater, font, warna,tinggi, lebar, dan lainya

Dengan Css kita bisa mendapatkan hasil yang lebih memuaskan bahkan code yang digunakan bisa lebih singkat dan otomatis dapat menyingkat waktu pekerjaan maka tidak salah css ini disebut bahasa canggih

Untuk mulai belajar Css setidaknya kita harus mengenal bahasa html,disini saya hanya akan menjelaskan Css secara global,diantaranya :

1.Sintax

Css mempunyai 2 bagian yang penting :
*selector
selector terdiri tag html seperti:head, body
*declaration
terdiri dari property dan value

contoh : head{font:black}

head menandakan selector dan black menandakan value
atau : head{background:red ; width:10px}
head sebagai selector dan background/width sebagai property,red/width sebagai value

2.Class dan Id
Yang di bahas disini hanya penulisan class dan ld
*Id selector
-penggunaan lebih spesifik
-penggunaan id diawali dengan tanda #
contoh:
#left{text-align:left;}

*class selector
-penggunaan lebih ke general
-penggunaan id diawali dengan tanda '.'
contoh nya:
.right {text-align:right;}

untuk jelasnya penempatan class dan id akan kita buat artikel khusus d stage selanjutnya,satu hal yang perlu di perhatikan kita harus ngerti bilamana ada pengubahan style element itu hanya 1x maka lebih efisien menggunakan id begitu jga sebaliknya,

3.Background

Sifat-sifat dari Background:

• backgroud-color
Value : color-rgb,color-hex,color-name,transparent,inherit
• background-image
Value :url(URL), none, inherit
• background-repeat
Value: repeat-x,no-repeat,repeat-x,repeat-y
• background-attachment
Value :scroll, fixed, inherit
• background-position
Value :left top,left center,left bottom,right top,right center right bottom, center top,center center,center bottom,x% y%,xpos ypos,inherit

Jika pada suatu code semua sifat diatas digunakan maka kita bisa menggabungkan semua sifat ke satu code background jadi tidak perlu menulis code satu persatu
contoh : body {background:red url('test1.gift') no-repeat scroll top;}
keterangan dari contoh diatas adalah :
-background-color = red
-background-image = url('test1.gift')
-background-repeat = no-repeat
-backgroundattachment = scroll
-background-position = top

Gak terasa mata ngantuk perut laper lagi,maka saya putuskan cukup dulu artikel ini nanti di lanjut pada kesempatan yang lain,wassalam.......

Komentar →