Hakkında Künye

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:



Cenk Atay
- 8 -