CSS Dersleri – BilgeBank
Cumartesi , Aralık 16 2017

CSS Dersleri

CSS Dersleri Ve Pratik Yönleri CSS Nedir? Ne İşe Yarar? Nasıl Kullanılır?

CSS İle Açılır Menü Yapımı (12. Ders Açılır Menü)

html menü

Css ile açılır menü yapımını adım adım resimli bir şekilde nasıl yapıldığını anlatmaya çalışacağım olayın  mantığını anladıktan sonra istediğiniz gibi çeşitli tasarımlar yapabilirsiniz. Öncelikle örnek sayfamız aşağıdaki örnekteki gibi olacaktır. [crayon-5a354e615d20d121461855/]   [crayon-5a354e615d219436232544/] Öncelikle menünün alanlarını oluşturalım sayfamızın ilk görünümü bu şekilde olacaktır. ul etiketiyle sıraladığımız için başlıklarında nokta işareti var …

Devamını Oku »

CSS İle Pozisyon Konumlandırma (11. Ders Position Fixed Kullanımı)

Position Fixed Kullanımı

Css ile alanlarımızda düzenlemeler yaparken position özelliğini kullanırız. Position özelliğinin 4 farklı değeri vardır; Static, Relative, Absolute, Fixed değerlerini alarak çeşitli konumlamalar elde edebiliriz. Position Kullanımı iyi kavrayabilmeniz için 4 ayrı ders halinde anlatmaya çalışacağız. Position: Fixed; Kullanımı Position:Fixed; özelliğimiz ise diğerlerinden farklı olarak alanımıza bağımlılık kazandırır. Şöyle ki: Position: …

Devamını Oku »

CSS İle Pozisyon Konumlandırma (10. Ders Position Absolute Kullanımı)

Position Absolute Kullanımı

Css ile alanlarımızda düzenlemeler yaparken position özelliğini kullanırız position özelliğinin 4 farklı değeri vardır; Static, Relative, Absolute, Fixed değerlerini alarak çeşitli konumlamalar elde edebiliriz. Position Kullanımı iyi kavrayabilmeniz için 4 ayrı ders halinde anlatmaya çalışacağız. Position: Absolute; Kullanımı Position:Absolute; özelliği Relative özelliği gibi kullanıldığında alanlar için bağımsızlık özelliği verir, ancak absolute …

Devamını Oku »

CSS İle Pozisyon Konumlandırma (9. Ders Position Relative Kullanımı)

position relative kullanımı

Css ile alanlarımızda düzenlemeler yaparken position özelliğini kullanırız position özelliğinin 4 farklı değeri vardır; Static, Relative, Absolute, Fixed değerlerini alarak çeşitli konumlamalar elde edebiliriz. Position Kullanımı iyi kavrayabilmeniz için 4 ayrı ders halinde anlatmaya çalışacağız. Position: Relative; Kullanımı Position:Relative; özelliğini kullandığımız alanlara bağımsızlık özelliğini vermiş oluyoruz örnekte de göreceğiniz gibi …

Devamını Oku »

CSS İle Menü Yapımı (7. Ders Css İle Yatay Menü)

yatay menü

Css ile Sayfamıza menü yapımının mantığını kısaca öğrenelim. Bu dersimizde basit bir menü yapımını öğreneceğiz, çünkü işin temel mantığını öğrenmeniz çok önemli. İlerleyen derslerimizde daha kapsamlı açılır efektli menüler yapımını elimden geldiğince öğretmeye çalışacağım. CSS Genel Tasarım Yapısı (4. Ders Alan Oluşturma) Dersimizde ki Sayfa Şablonumuza basit bir menü yapalım …

Devamını Oku »

CSS İle Pozisyon Konumlandırma (8. Ders Position:Static; ve Float: Left; Kullanımı)

static

Css ile alanlarımızda düzenlemeler yaparken position özelliğini kullanırız position özelliğinin 4 farklı değeri vardır; Static, Relative, Absolute, Fixed değerlerini alarak çeşitli konumlamalar elde edebiliriz. Position Kullanımı iyi kavrayabilmeniz için 4 ayrı ders halinde anlatmaya çalışacağız. Position: Static; Kullanımı Eğer alanlarımıza herhangi bir position değeri belirtilmemiş veya float özelliği verilmemiş ise alanlarımız position static özelliğini varsayılan olarak okur ve …

Devamını Oku »

CSS Resim Ekleme Ve Düzenleme (6. Ders Css İle Resimleri Düzenleme)

türk bayrağı

Css ile sayfamıza resimler ekleyerek ve düzenlemeler yaparak çeşitli görsel tasarımlar yaparız. Css ile resim eklemek için background-image: url(“resimler/resimadı.jpg“) ; kodunu ekleyerek sayfamıza resmimizi tanıtabiliriz. Ancak resimlerin boyutları veya tarayıcı farklılıklarından oluşacak hatalardan dolayı birkaç tanımlama ve özellikler vermemiz gerekir. [crayon-5a354e615e278173149957/] Hemen örneğimize geçerek genel çalışma alanımızı yani body alanımıza birkaç …

Devamını Oku »

CSS Font Özellikleri (5. Ders Yazı Metinlerini Düzenleme)

css yazı özellikleri

Sayfanızda oluşturmuş olduğunuz içerik alanlarında ki yazılarınızı bir kaç ufak değişiklikle daha görsel hale getirebilirsiniz. Bu dersimizde en çok kullanılan font özelliklerini örnekte anlatacağız ve örnekleme yapmadığım birçok özelliği de zamanla diğer deslerimiz de yapacağız ve hemen örnek yazı şablonumuza bakalım. [crayon-5a354e615e529102448618/] body{ margin:0; padding:0;} Komutumuz ile alanımızın boşluklarını sıfırladık. …

Devamını Oku »

CSS Genel Tasarım Yapısı (4. Ders Alan Oluşturma)

Css ile Sayfa İskeleti Oluşturma

Artık Css ile eğleneceğiniz, sinirleneceğiniz, olmuyor diye isyan edeceğiniz kısımlara başladık ama pratiğiniz arttıkça geriye dönüp baktığınızda, “ben bunda mı takıldım” diyeceğiniz dersler bundan sonra başlıyor. Html ve Css ile artık bir web sayfası iskeletini hazırlama zamanımız geldi. Bir web sayfası tasarımı yapmaya başlarken kafanızda nasıl bir site olmasını planlayın, …

Devamını Oku »

CSS Alan Belirleme (3. Ders Etiket, İd, Class Alanları)

css alan belirleme

Css dosyamız üzerinde Html sayfamızdaki alanların seçicilerini belirlemek için 3 farklı yöntemimiz vardır. Html in bize sunmuş olduğu etiket isimlerini yazarak p, span, h1, h2 …. vb gibi hazır etiketlerin isimlerini kullanarak css de seçici alanına sade etiketi yazarak seçicisini belirleyebiliriz. h1 {  } Seçeceğimiz alana <h1 id=“buyukyazi”> gibi id değeri atayarak …

Devamını Oku »

CSS Yapısı Ve Kuralları (2. Ders Seçici { Özellik : Değer ; } )

Css Yapısı Seçici, Özellik, Değer

Css’in yapısına bakacak olursak Seçici { Özellik : Değer ; } Olarak komutlarımızı yazarız. Seçici Alanı : Html sayfamızdaki id, Class değerlerimizi veya Etiketimizin ismini yazarak hangi alanda işlem yapacağımızı belirtiriz. örnek olarak html sayfamızda kullandığımız <span> etiketini tanımlamak için span  yazmamız yeterli olacaktır veya <div id=alanadi> alanımızda işlem yapacağımızı belirtmek için #alanadi yazmamız yeterlidir.  id, …

Devamını Oku »

CSS Nedir? (1. Ders CSS Bağlantısı Ve Tanımı )

css dersleri başlangıç

Css Derslerine Başlamadan önce Html Derslerini bitirmiş olmamız gerekir. Çünkü Css dili Html kodlarımızın daha geniş ve düzenli şekilde biçimlendirmemize yarayan tanımlama dilidir. CSS in açılımı Cascading Style Sheets dir. Türkçe anlamı da Basamaklanmış Stil Katmanları diye okunuyor. Bunlara çok fazla takılmadan, Neden Css Öğrenmeliyiz sorusuna cevap olarak şunları diyebiliriz: Css ile htlm sayfa yapımızı daha kapsamlı …

Devamını Oku »