Top

seçici Tag

  • All
  • Dijital pazarlama
  • Dijital, İyi Şeyler Podcast
  • E-Ticaret
  • Eğitim
  • Growth hacking
  • İnceleme
  • Kişisel
  • Rehber
  • Reklam
  • Sosyoloji
  • Teknoloji
  • Wordpress

Not: Bu içerik ve içerikler dizisi, Css’in doğru kaynaklardan öğrenilmesi ve Türkçe kaynak sıkınıtısının giderilmesi adına w3schools’tan çevirilmiştir. Online yani çevrimiçi editör de w3schools’a aittir. Herhangi bir sorunuz için aşağıya yazabilirsiniz!Grup Seçiciler Stil dosyasında aynı stile sahip elementler mevcut olabilir.h1 { color:green; } h2 { color:green; } p { color:green; }Kodu kısaltmak için,seçicileri gruplayabilirsiniz.Herbir seçiciyi virgül ile...

ID ve Class Seçicileri

HTML elementlerini biçimlendirmenin ötesinde CSS kendi seçicilerinizi id ve class olarak oluşturmanızı sağlar.

ID Seçici

ID seçici yegane tek bir element için stillendirme yapar.

HTML elementinin id özelliğinin değeri kullanılır ve css dosyasında ‘#’ değeri kullanılarak tanımlama yapılır ve biçimlendirilir css’te.

Örnek; menu id’sine sahip element için css yazımı;

#menu
 {
 text-align:center;
 color:red;
 }

ID’yi sayıyla başlatmayın Firefox’ta çalışmaz çünkü.

Class Seçici

Class seçici, html elementler grubunu biçimlendirmek için kullanılır. ID seçicisinin haricinde, class seçici birçok kez kullanılabilir.

Bu da sayılar ile başlamamalı çünkü Internet Explorer desteklememekte.

Aynı class ile belirli birçok HTML elementini şekillendirebilirsiniz.

HTML’nin class özelliğini kullanarak ve css’te başına nokta koyarak tanımlarsınız bu seçiciyi.

Örnekte merkez class’ına sahip bir css stilini göreceksiniz;

 .merkez{text-align:center;}

Şunu da yapabilirsiniz class ile; sadece belirlediğiniz HTML elementlerinin class tarafından etkilenmesini sağlayabilirsiniz.

Mesela tüm p etiketlerine merkez class’ı uygulanır bu da hepsini merkeze alır tanımdan yola çıktığımızda.

p.center {text-align:center;}

Css öğrenmeye başlamadan önce  HTML veya XHTML bilmeniz gerekmektedir. Bilmiyorsanız buraya tıklayarak öğrenmeye başlayabilirsiniz.

Css Nedir?

Css yığma stil dosyasıdır.

  • Stiller HTML elementlerinin nasıl gösterileceğini tanımlarlar.
  • Stiller bir problemi çözmek için eklenmişti HTML 4.0’a.
  • Harici Stil dosyaları birçok işten kurtarır.
  • Harici stil dosyaları CSS dosyalarında tutulur.

CSS’e ait bir demo var. Bunu görüntülemek için buraya tıklayın; ilk üçü farklı stillere sahip, without yazan stilsiz görünüm ve alttaki üçü de stil dosyalarının içerikleridir.

Stilleri büyük bir problemi çözdü

HTML, bir belgeyi biçimlendirmek için etiketler içeren bir şekilde tasarlanmamıştı.

Bir belgenin içeriğini belirlemek için tasarlanmıştı; tıpkı:

<h1>Bu bir başlık</h1>
<p>bu bir paragraf</p>

HTML 3.2’de <font> etiketi gibi etiketler eklendiğinde web geliştiricileri için bir kabus oldu bu durum. Büyük siteleri geliştirmek, fontları ve renk bilgilerini tek tek er sayfa için değiştirmek uzun ve pahalı bir süreç haline geldi.

Bu problemi çözmek içinse; WWW konsorsiyumu CSS’i oluşturdu.

HTML 4.0’da tüm formatlar HTML belgesinden arındırıldı ve ayrı bir css dosyasında barındırılmaya başlandı.

Günümüzde tüm tarayıcılar css’i desteklemekte.

CSS bizi iş yükünden kurtardı

CSS HTML elemanlarının nasıl gösterileceğini tanımlar.

Bu sayede birçok sayfaya bağlı olan css dosyasını değiştirdiğimizde tüm sayfalarımız da değişecektir. Bizleri uğraştan kurtaracaktır.