CSS Nedir.

CSS hakkında yardım alabilir ve paylaşımlarınızı yapabilirsiniz.
Cevapla
Kullanıcı avatarı
Gökhan
Deneyimli Üye
Deneyimli Üye
Mesajlar: 390
Kayıt: 11 Şub 2009, 22:57

CSS Nedir.

Mesaj gönderen Gökhan » 28 Şub 2009, 13:59

CSS (Cascading Style Sheet) Türkçe'ye Stil Şablonları olarak çevrilmiştir. (Bire bir anlamı bu olmasa da).

Günümüzde CSS kullanmadan bir web sayfası yapmak artık kimsenin tercih ettiği bir durum değil ve zaten tavsiye de edilmiyor.
Sayfamız içerisinde bulunan ögeleri, renk boyut konum ve sağ-sol-üst-alt boşlukları olarak düzenlemek css ile yapıldığında son derece basit ve kullanışlı olacaktır.

HTML kodlarımız arasında lokal düzenlemeler yerine, tüm sayfaya, hatta birden çok sayfaya bile etki edecek düzenlemeleri CSS ile yapabiliriz.

Bunun bize ne faydası olacak?
CSS hem HTML ye göre daha çok ve esnek düzenleme kodları içeriyor, hem de sayfalarımıza topluca ve sonradan müdahaleyi de kolaylaştırıyor.

Kullanım şekillerine göre css i 3 başlık altında toplayabiliriz.

1- Yerel Kullanım
Tıpkı HTML de olduğu gibi, css kodlarını bir HTML parametresi içinde yazarak ve sadece yazıldığı yerde etkili olacak şekilde kullanım.
Bu kullanım şekli çok yaygın değildir.

Örnek olarak bir yazının rengini kırmızı ve boyutunu da 14 pixel olarak ayarlayalım.

Kod: Tümünü seç

<body>
<h1 style="color:red;font-size:14px;">H1 etiketi alanında yazılan bu yazı kırmızı ve 14px olmalı</font>
</body>
Yukarıdaki kodlamada gerçekte metni büyütüp kalın yazdıran <h1>...</h1> başlık etiketi,
sadece bir defalık kırmızı ve 14 pixel yazdıracak şekilde ayarlandı.

CSS kodu HTML nin style parametresinin içerisine yazıldı.

HTML de parametre, eşittir ile çift tırnakar arası değer şeklinde yazılıyor,
CSS de ise eşittirin yerini ikinokta aldı ve tırnaklar da yok,
dikkat edilmesi gereken ise her bir parametre ve değeri arasında noktalıvirgül ile ayraç kullanılması.
(;) ayracımızı kullanmadığımız taktirde kodlarda ifadeler birbirine karışacak ve çalışmayacaktır.


Devam Edecek

Kullanıcı avatarı
Gökhan
Deneyimli Üye
Deneyimli Üye
Mesajlar: 390
Kayıt: 11 Şub 2009, 22:57

Global Kullanım.

Mesaj gönderen Gökhan » 07 Mar 2009, 13:47

Yukarıdaki örnekte görülen <h1> etiketini tüm sayfa için değiştirmek istersek, bu sefer gerekli css kodunu <style>...</style> etiketleri arasında yazabiliriz.

Kod: Tümünü seç

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-9" />
<title>CSS Global Kullanımı</title>
<style>
h1{color:red;font-size:14px;}
</style>
</head>

<body>
<h1>H1 etiketi alanında yazılan bu yazı kırmızı ve 14px olmalı</h1>
</body>
</html>
Tag yazıldıktan sonra, küme parantezleri arasında (blok) istenilen css kodları yine ilk örnekte anlatıldığı gibi yazılır.

Örnek olarak, tüm sayfamızda geçerli olacak font rengi, büyüklüğü tipi, artalan rengi vb özellikleri ayarlamak istersek, bunu body tagını yazarak yapabiliriz.

Kod: Tümünü seç

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-9" />
<title>CSS Global Kullanımı</title>
<style>
body{
color:#333333;
font-size:12px;
font-family:'Trebuchet MS';
background-color:#e2e2e2;
}
</style>
</head>

<body>
Css ile bu sayfanın bazı özellikleri belirlendi.
</body>
</html>
Devam Edecek

Cevapla

Kimler çevrimiçi

Bu forumu görüntüleyen kullanıcılar: Hiç bir kayıtlı kullanıcı yok ve 1 misafir