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..
CSS 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
Lutfen Soru ve sorunlarınız hakkında, iletişim bölumunu kullanmak yerine yorum yapınız!
18 Yorum => “CSS BaÅŸtan Alalım?”
Geri Bildirimler
-
[...] Zingocan.com Takipçileri.. Dün bahsettiğim gibi en basitten alarak CSS derslerine başlamıştık.. Bu kısa dersimizde de CSS Text Stilling [...]
-
[...] merhaba arkadaşlar.. CSS En baştan aldığımız derslerimizden Yazı Tiplerini stillendirme özelliğini [...]
-
[...] (açıklama için CSS Derslerimizi ziyaret [...]
-
[...] Border ÖzellikleriCSS Derslerimizin bir başka başlığı olan kutu modelleme işlemi, CSS içerisinde bulunan border özelliği ile [...]
-
[...] arkadaşlar.. CSS Stilleme ve CSS Kutu Modelleme derslerinden sonra son şimdi de CSS İleri Seviye derslerine [...]
-
[...] arkadaşlar.. CSS Advanced kategorisinde CSS Floating adındaki WordPresste bir nevi Thumb olarak da adlandırılabilecek olan [...]
-
[...] arkadaşlar.. Bu CSS dersimizde de CSS Align olarak birkaç bölüme ayıracağım Yüzey alanı parametresini daha önce [...]
Yorum Bırak
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.
Bazen böyle düşünebilirsiniz fakat kodların dizilimine aşina olduktan sonra özellikle oturup ezberlemek gerekmeyecektir.
This is my first time visiting your blog. I do envy you since you seem to get a lot more comments then I do. Do you have any secret tips on how I can get more comments or do I just have to be paitent? Anyway, keep up the good work.