Temmuz 2007
Web Teknolojileri
CSS Dersleri-2
Yeniden merhabalar efendim. Bu yazımızda, geçen ay CSS-1 yazımızda da belirttiğimiz üzere arkaplan, font, çerçeve, liste ve tablo özelliklerinden bahsedeceğiz.
1. Arkaplan Özellikleri:
- background-color: Bir bileşenin arkaplan rengini ayarlamak için kullanılan özelliktir. "black", "red" gibi değerler alabileceği gibi "#12ab34" gibi hexadecimal değerler de alabilir.
- background-position: Arkaplana konulan resmin başlama noktasını belirtmek için kullanılır. Bu özellik için "top left", "center right" gibi değerler yanında "%20 %60" gibi yada "60px 20px" gibi değerler de kullanılabilir.
- background-repeat: Arkaplana konulan resmin tekrar edip etmeyeceğini ayarlamak için kullanılır. "repeat", "repeat-x", "repeat-y" ve "no-repeat" değerlerini alır.
- background-attachment: Arkaplan resminin sayfayla birlikte kayıp kaymayacağını belirten özelliktir. "scroll" ve "fixed" değerlerinden birini alır.
- background-image: Arkaplana resim koymaya yarayan özelliktir. "url(resmin_kaynağı)" ve "none" değerlerinden birini alır.
2. Font Özellikleri:
- font-family: Font tipini değiştirmeye yarayan özelliktir. Değer olarak "Arial" gibi font isimleri yada "Sans-serif" gibi font aile isimlerini alır.
- font-size: Font büyüklüğünü belirten özelliktir. "small", "medium", "large" gibi değerlerin yanında sayısal değerler ve "%"li değerler alabilir.
- font-style: Font görünüşünü belirleyen özelliktir. "normal", "italic" ve "oblique" değerlerinden birini alır.
- font-weight: Font kalınlığını belirler. "normal", "bold", "bolder", "lighter" değerlerinin yanında "100"-"900" arasında değerler de alır.
3. Çerçeve Özellikleri:
- outline-color: Çerçeve rengini atayan özelliktir. Renk isimlerini, hexadecimal değerleri ve "invert" değerlerini alabilir.
- outline-style: Çerçevenin görünüşünü belirleyen özelliktir. "dotted", "dashed", "solid", "double", "groove", "ridge", "inset" ve "outset" değerlerinden birini alır.
- outline-width: Çerçevenin kalınlığını belirleyen özelliktir. Sayısal değerler yada "thin", "medium", "thick" değerlerini alır.
4. Liste Özellikleri:
- list-style-type: Liste işaretçisinin tipini belirler. "disc", "circle", "decimal" gibi değerler alır.
- list-style-position: Liste işaretçisinin nerede olması gerektiğini belirler. "inside" yada "outside" değerlerinden birini alır.
- list-style-image: Liste işaretçisine bir resim atamak için kullanılır. "url(resmin_kaynağı)" yada "none" değerlerinden birini alır.
Bu ayki yazımızı da burada noktalıyoruz. Gelecek ay CSS-3 yazımızda kutu modelinden (box model) ve HTML + CSS ile nasıl sayfa tasarlanabileceğinden bahsedeceğiz...
Kaynaklar:
- 8 -
