Merhaba arkadaşlar.. jQuery Derslerime gösterdiğiniz ilginiz için hepinize çok teşekkür ederim.. Aldığım birkaç mail ve istek sonucunda benim de bildiğim kadarıyla CSS konusuna da el atmaya karar verdim.. İlk olarak basit bir kaç bilgi vereceğim.. Bu bilgilerde video çekmeye ihtiyaç duymadım zaten gerek de yok gibi..
[dropcap]C[/dropcap]SS konusunda aslında hiç bilmeyenler için birkaç ders eklemiştim fakat gördüğüm kadarıyla yine birkaç arkadaş CSS kullanımında zorluk çekmekte.. Bu konu itibariyle CSS’i daha kolay anlama ve uygulama konusunda sizlerinde desteğiyle baştan başlayalım dedim..
Şu konuda bahsettiğim CSS’i neden kullanmalıyız başlığını ilk olarak okumanızı öneririm.. Şimdi CSS adına birkaç tane kural söyledikten sonra ufak bir örnekle derslerimize başlayalım;
- CSS kodlarını yazarken mutlaka seçicileri kullanmalıyız.
- CSS içeirsinde bir takım özel seçiciler mevcuttur. Bunları kullanmak için seçici adını girdikten sonra stil değerini iki süslü parantez ( { …. } ) arasına girmeliyiz.
- Diğer seçicileri kullanırken class seçicisinin önüne . (nokta) id seçicilerinin önüne ise # (kare) işareti gelmelidir.
- CSS yalnız kod kullanarak yazılır, herhangi bir görseli ifade etmez, bilakis görselleri şekillendirmeye yarar.
- Tüm bunlarla sınırlı değildir, kurallar ile W3 standartları ayrı şeylerdir, fakat bir W3 standartlarında CSS kodları girmemiz birçok açıdan yarar sağlayacaktır
- Ve son olarak yukarıda bahsettiğim gibi; Neden CSS?
Şimdi basit bir örnek yaparak CSS’i anlayalım..
HTML kodlarken CSS i 3 ayrı şekilde kullanabiliriz..
- Etiketlerin içerisine CSS seçicilerini girerek.
- head etiketinin içerisine <style type=”text/css”></script> kodlarının arasında girebilecek CSS kodlarıyla.
- .css dosyası oluşturarak CSS kodlarımızı bu CSS dosyası içerisinde kullanarak.
Bu çeşitleri yavaş yavaş kullanarak öğreneceğiz. İlk olarak ben <head> etiketinin içerisinde göstereceğimiz CSS kodlarımızdan bahsetmek istiyorum..Yukarıda bahsettiğim <style type=”text/css”>…</script> kodunu girdikten sonra üç nokta ile belirttiğim bölgeye aşağıdaki kodları giriyorum;
h1 {background-color:#6495ed;}
Burada da CSS dosyamızın body etiketlerinin (sitemizin tamamı) arasında kalan bölüme bir arkaplan resmi yerleştirdik ve url ataması yaparak bir arkaplan resmi yerleştirdik.
Gördüğünüz gibi olay çok basit aslında.. İlk önce seçici, sonra süslü parantez ve içerisine de değişkenlerimiz.
Bir daha ki derste daha ayrıntılı örneklere değineceğim..
Güneşli Günler..
Bu dersten Sonra Devam edebileceğiniz konular aşağıda sürekli Güncellenecektir
- CSS Stil Tipleri
- CSS Kutu Modelleri
- CSS İleri Seviye
cssde background-color gibi fonksiyonların öğrenilmesine baglı biraz ezbere dayanan bir dil heralde
Bazen böyle düşünebilirsiniz fakat kodların dizilimine aşina olduktan sonra özellikle oturup ezberlemek gerekmeyecektir.
Çok Güzel olur hocam yaa şimdiden teşekkür ederiz =)
Merhaba zingo, yazılarınızı büyük bir özenle takip etmekteyim, konu ve dersleriniz de güzel fakat neden artık film yayınlamıyorsunuz?
Güzel olmuş teşekkürler
Güzel Arkadaşım, ellerine sağlık,
Çok basit bi ders olmuş aga yaaa
Ya güzel de şimdi biz bunların hepsini ezberleyecekmiyiz bütün kodları
Hepinize teşekkürler arkadaşlar..
Filmlere bir süreliğine ara verdik..
Zaten başta da belirttiğim gibi basit bir ders, baştan alıyoruz.
Pingback: CSS ile Yazı Stilleri - Zingocan
Pingback: CSS Yazı Fontları - Zingocan
Pingback: CSS Listeleme Stilleri - Zingocan
Bazen böyle düşünebilirsiniz fakat kodların dizilimine aşina olduktan sonra özellikle oturup ezberlemek gerekmeyecektir.
Pingback: CSS Border – Kenarlık Ayarları - Zingocan
Pingback: CSS Grup ve Yuva Seçicileri - Zingocan
Pingback: CSS Floating – Sabit Olmayan Nesneler - Zingocan
Pingback: CSS Align – Hizalama - Zingocan
I’d have to bury the hatchet with you here. Which is not something I usually do! I enjoy reading a post that will make people think. Also, thanks for allowing me to comment!