Digital Design Çeşmesi

Bayağıdır CSS'in devamını yazamdım buradan devam edelim.
Class(sınıf)Seçicilerden(selector) bahis ederken aklıma gelmişken HTML taglerini yazdığınızda;

hem h2 denilen header(başlığı)ın arka palanını renklendirmiş oluruz ki vurgulamak için (highlight)hem de paragraf tag'indeki yazı karakterlerini ufaltmış oluruz.

Dikkat edilecek  bir husus ta Class(sınıf) adlarına numerik olarak başlamak Internet Expolorer dışındaki tarayıcılarda sorun yaratabilir.
Bir sonraki yazımızda ID seçicilerine değineceğim aslında pek farkı yok sınıf seçicilerinden.
Sevgiyle kalın

Selamlar tekrar,
CSS yazı dizisine devam.Bu gün sınıf(class) seçicisine(selector) bakalım.Aynı tipteki html tag)(elementi) için,farklı stilleri class selector ile tanımlayabiliriz.
Diyelim ki dökumanıznızda iki paragraf olmasını istiyorsuuz biri sağa hizalı diğeri merkeze;
HTML dökümanınızda class (attribute) niteliğini kullanmanız gerekir aşağıda;

Bir tag'e(element'e) birdan fazla class eklemek istiyorsanız;

Yukarıdaki paragraf class lar tarafından ortaya hizalanıp, bold(kalın) olacak.

Bunların dışında selectordeki tag'i kaldırıp aynı class dan olan HTML elementlerine de uygulayabiliriz.Aşağıdaki örnekte tüm class="center"olan html elementleri ortaya hizalanacak.(aşağıdaki örnek);

Şimdilik bu kadar daha sonra devam.
Sevgiyle kalın

CSS ayrıntılarına geçmeden önce biraz tarihçesine bakmakta fayda var.
Şimdi sorabilisiniz kimler yaratıyor bu kargacık burgacık kodları diye.Valla işin asıl sorumlularından birisi W3.org yani world wide web consortium.Şimdi bu birim aslında tavisye merci bire bir karar merci değil.W3org Internetin nasıl çalışacağını ve gelişeceğini tavsiyeler ile bütünleştiren bir kuruluş.Tabii bu arada bu kuruluşa desetek veren firmalar ve kuruluşlar var.Bunlar; Adobe,Microsoft, Mozzila Foundation,Apple ve IBM gibi. Burada yalnızca CSS standartarı değil diğer lenguage ve script standartları da belirleniyor.CSS satandartları için W3.org içinde bir gurup ver tıpki diğer guruplar gibi çalışıyor. Aslında w3org gerçek anlamda diller üzerinde bir kontrolu yok sadece tavsiye anlamında yardım ediyor.Fakat bu standartların oluşumunda büyük rol oynuyor.Bağımsız şirketler ve organizasyonlar yazılımı yaratıyorlar.
Biraz CSS tarihine bakalım.Aslında  yeni değil CSS 1990 ların ortasında HTML dahilinde plan ın bir parçasıydı. Ama standart aşamaya getirilmemişti henüz. 1994 te Tim Barnes Lee World Wide Web Consortium' u yapılandırdığından hemen bir kaç gün sonra Hakon  Wium Lie ilk Cascading HTML Style Sheets taslağını yayınladı.Hakona' a cevap gecikmedi ve Bert Bos ta kendi üzerinde çalıştığı taslağı sundu.Daha sonra bu ikili güçlerini pekiştirerek CSS’i yaratılar.Bu dönemlerde biraz tartışma konusu olmadı değil ama uluslararası birliktelik sonunda CSS i kabul etti.Bunlar arasında en büyük kuruluş Microsoft idi ve Internet Expolerer da destek verdi.Buna rağmen Netscape o zamanın en önemli browseri diyelim biraz kuşkucu bakıp bu oluşuma kendi style sheet ini yaratı ve adına Javascript style sheet  JSS koydu.Ama sonuçta Microsoft IE populerliği tartışılmaz olduğundan CSS desteği yerini buldu.Günümüzde bütün ana browserlar CSS desteğini vermektedirler.İşin tuhaf tarafı Microsoft ilk başlardaki desteğini nedense aynı hızda sürdürmemekte.Bu da biraz yakınmalara sebep olmakta.
Daha sonra ayrıntılara devam edeceğim.
Sevgiyle kalın

İlk CSS ile karşılaşmamda diğer language ve script ile karşılaşmam gibi panik olmuştum.Tasarım geçmişi olan kişi neden böyle programlama kokan işlere dalsın ki.Ama maalesef Internet web sitesi mantığına girdiğinizde kaçamıyorsunuz.Daha neler neler karşınıza çıkıyor.Örneklerimi?HTML/XHTML,JavaScript,DHTML,XML,AJAX gibi ürkünç kısaltmalar ve bunların korkunç açılımları.Buyrun bakalım CSS yığılmalı stil sayfaları.Nasıl yani neyi yığacağız?Hangi stil,nasıl sayfadır bu?Gibi sorular kafanızı kurcalayabilir ben bu temel anlatımda kafa bulandırmadan CSS'e bakmaya çalışacağım.
CSS' e bakmadan evvel biraz HTML/XHTML bilgisi olmasında büyük yarar var.Uzun lafın kısası şudur.HTML tasarlayan kardeşler sayfanın pek de nasıl görünceğini.Dizayn anlamında görselliği nasıl ön plana çıkaracaklarını pek dikkate almamışlar.Zaten o zmanalar gerekte yok.Sadece bir gurup yada guruplar arasında bir ağ içerisinde bilgi akışını sağlamak dertleri.Fakat iş ne zaman Internet yani dünyaya açılma ortamına gelmiş işler biraz sarpa sarmaya başlamış.Aman görsellik anlamında birşeyler yapalım.Ek scriptler ekleyelim denmiş ve hala denmekte, ortaya bir çok dil çıkmış.World Wide Web Consortium'da bu işi bir güzel üstlenip dağınık bu yapıyı daha düzenli hale getirmeye çalışıyor.Ve bu çalışmalar sonucu bizde bu gelişen teknolojik yapıyı takip etmek durumundayız.Gelelim CSS'e
CSS, W3org'a göre HTML elmentlerini nasıl görüneceğini tanımlıyor.HTML belgesine gömerek yada dışarıdan CSS sayfası olarak(internal/external) çalışmanız mümkün.Bu ne demektir özellike dışarıdan bir CSS sayfası yapılandırıp bütün HTML elementlerine hakim olmanız mümkün aksi taktirde müthiş bir zaman kaybı.Düşünsenize bir background değiştirmek içim tüm HTML/XHTML sayfalarını çalışmanız lazım.Yani üç beş tamamda 50 den sonrası beni gerer derseniz CSS büyük yardımcınız.
CSS yapısına yani syntax'ine yada garemerine diyelim bakacak olduğumuzda,temel yapı üç parçadan oluşuyor.Selector HTML element'i yada teg'i,property değiştirmek istediğiniz özellik/sıfat, ve bu özelliğe verilen bir değer value.
selector {property: value}
Yukarıdaki yapıya baktığınızda propert ve value iki nokta üst üste ile ayrılmış ve kıvırımlı parentez dahilindeler. Eğer value(değer)bir kelimeden fazla ise ütse çift tırnak virgül ekleriz.
p {font-family: "sans serif"}
Birden çok property tanımlamak istediğinizde her property'i noktalı virgülle ayıralım.
p {text-align:center;color:red}
Aslında her script yazılımında olduğu gibi yazı tarzımızı satırlara bölmemizde fayda var okunurluğu sağlamak için.Aşağıdaki paragrafın textini merkeze(ortaya) hizaladık,rengini siyah verdik ve font tipini de arial yaptık.

p
{
text-align: center;
color: black;
font-family: arial
}

Yukarıdaki örnekte dikkatinizi çeken bir şey oldumu?Satırların sonu noktalı virgül ile bitiyor,yalnızca font-family dışında.Noktalı virgül ister koyun ister koymayın.Koymanızda ki avantaj daha sonra eklenti yaptığınızda ek iş olmaması.

Selectörleri'de guruplamak mümkün nasılmı araya virgül koyarak,

h1,h2,h3,h4,h5,h6 
{
color: green
}

Yazı dizisine devam edeceğim
Kaynak w3.org
Sevgiyle kalın