Css Kodları Ve Kullanımları [Ders 1]

[LastWorld]

Merhaba Arkadaşlar . Ben Css Kodlarına Meraklıyım Ve Öğrenmeye Çalışıyorum Sizin de Öğrenebilmeniz İçin Bu Konuyu Açtım . 2 Ders Vereceğim .Biraz Uzun ama İşinizi Görür . Kodlar Ve Açılımları ;


background >> artalan özellikleri
backgrond-color >> artalan renk

Kod: Tümünü Seç Tümünü Kopyala

background-color:color-rgb;
background-color:color-hex;
background-color:color-name;
background-color:color-transparent;

background-attachment >> artalan resmin diğer elemanlara göre sabitlenmesinisi veya kaymasını belirler

Kod: Tümünü Seç Tümünü Kopyala

background-attachment:scroll;
backgrond-attachment:fixed;

background-image >> Artalan resmi tanımlar

Kod: Tümünü Seç Tümünü Kopyala

background-image:url();
background-image:none;

background-position >> artalan resmin başlangıc yerleşim noktasını belirtir.

Kod: Tümünü Seç Tümünü Kopyala

background-position:top left;
background-position:top center;
background-position:top right;
background-position:center left;
background-position:center center;
background-position:center right;
background-position:bottom left;
background-position:botton center;
background-position:bottom right;
background-position:x% y%;
background-position:xpos ypos;

background-repeat >> Artalan resmin tekrarlanmasını belirtir

Kod: Tümünü Seç Tümünü Kopyala

background-repeat:repeat;
background-repeat:no-repeat;
background-repeat:repeat-x;
background-repeat:repeat-y;

border >> Kenar çizgisi özellikleri (renk, kalınlık, style)

Kod: Tümünü Seç Tümünü Kopyala

border-width:
border-style:
border-color:
border-bottom:
border-bottom-color:
border-bottom-style:
border-bottom-width:
border-left:
border-left-color:
border-left-style:
border-left-width:
border-right:
border-right-color:
border-right-style:
border-right-width:
border-top:
border-top-color:
border-top-style:
border-top-width:

clear >> float uygulanmayan elemanın köşe tanımını yapar.

Kod: Tümünü Seç Tümünü Kopyala

clear:left;
clear:right;
clear:none;
clear:both;

cursor >> maus imlecin görünümünü belirler.

Kod: Tümünü Seç Tümünü Kopyala

cursor:url;
cursor:auto;
cursor:crosshair;
cursor:default;
cursor:pointer;
cursor:move;
cursor:e-resize;
cursor:ne-resize;
cursor:nw-resize;
cursor:n-resize;
cursor:se-resize;
cursor:sw-resize;
cursor:s-resize;
cursor:w-resize;
cursor:text;
cursor:wait;
cursor:help;

display >> Elamanın nasıl görüneceğini belirler.

Kod: Tümünü Seç Tümünü Kopyala

display:none;
display:inline;
display:block;
display:list-item;
display:run-in;
display:compact;
display:marker;
display:table;
display:inline-table;
display:table-row-group;
display:table-header-group;
display:table-footer-group;
display:table-row;
display:table-column-group;
display:table-column;
display:table-cell;
display:table-caption;

float >> Elemanın diğer elemanlara göre konumunu belirler.

Kod: Tümünü Seç Tümünü Kopyala

float:left;
float:right;
float:none;

position >> Elemanın konumunu belirler.

Kod: Tümünü Seç Tümünü Kopyala

position:static;
position:relative;
position:absolute;
position:fixed;

visibility >> Elemanın görünür veya gizli olacağını belirler.

Kod: Tümünü Seç Tümünü Kopyala

visibility:visible;
visibility:hidden;
visibility:collapse;

DEVAMI GELECEKTİR . İYİ FORUMLAR ...

[Şükrü K.]

Teşekkürler =)

[LastWorld]

Teşekkürler =)

Önemli Değil..

[XTK]

Teşekkürler

[LastWorld]

Teşekkürler

Önemli Değil .

[L34DRi]

Teşekkürler.Ama bu kadarı yetmez ki :) Okuyan ve hiç bilmeyen kişi

background-color:

kodunu nasıl kullanacağını bilmez ki !

Ayrıca kimse background-color: kullanmaz.Genellikle

background: kullanılır.Eğer renk yazılacaksa direk renk kodu #000 gibi veya RGB kodu ise de rgb(255,255,255) gibi kodlar konulur.Eğer arkaplana resim konulacaksa ;

background:url(http://adres.l34.dri) şeklinde olur.Mesela şunların açıklaması yok ki ? :)

PHP Kod: Tümünü Seç Tümünü Kopyala

background-repeat:repeat;
background-repeat:no-repeat;
background-repeat:repeat-x;
background-repeat:repeat-y; 


Ben açıklayayım ;

background-repeat:repeat; resim her iki yönden tekrar eder.
background-repeat:no-repeat; resim tekrar etmez.
background-repeat:repeat-x; resim x (sağ-sol/yatay) yönünde tekrar eder.
background-repeat:repeat-y; resim y (yukarı-aşağı/dikey) yönde tekrar eder.

PHP Kod: Tümünü Seç Tümünü Kopyala

border-width:
border-style:
border-color:
border-bottom:
border-bottom-color:
border-bottom-style:
border-bottom-width:
border-left:
border-left-color:
border-left-style:
border-left-width:
border-right:
border-right-color:
border-right-style:
border-right-width:
border-top:
border-top-color:
border-top-style:
border-top-width: 


Yüzlerce kod... :) Hiç gerek yok.

border-style: border ın yani çerçevenin şeklini belirtir.Çizgi,noktalı falan...
border-left: sol çerçevenin özellikleri
border-right: sağ ................
border-bottom: aşağı ................
border-top: yukarı ....................

Bunların sonuna renk kodlarını eklerseniz rengini belirlersiniz.Sonuna dotted yazarsanız style'ını belirlersiniz.Hepsine aynı değer girecekseniz kısaca ;

PHP Kod: Tümünü Seç Tümünü Kopyala

border: 1px solid #98f2b1; 


yazabiliriz.

[Matrix4040]

Teşekkürler.