Webmaster Araçları

Özellikler
.zemin
.knearlık
.font
.lise
.margin
.padding
.metin
.floating ve positing
.tablo

css-zemin özelikkleri
+background-color:p{background-color:#ddd;}
+background-image:body{background-image:url(/images/deneme.gif);}
+background-repeat:
body{
background:white url(deneme.gif);
background-repeat:repeat-x; —-> x yönünde resim kendini yeniliyor.
}
+background-attachment:
body{
background:white url(deneme.gif);
background-attachment:fixed —->resmin sayfa ile scroll edilip edilmeyeceÄŸi
}
+background-poistion:
body {
background-image:url(deneme.gif);
background-repeat:no-repeat;
background-position:center —>yüklenen resmin balangıç noktasını belirler.
}

css -font özellikleri
+color:  p {color:red}
+font-family:
p{
font-family:Verdana,Arial,Helvetica,san-serif;
}
p{
font-family :”Times New Roman”; —-> birden fazla kelime içeriyorsa font bu ÅŸekilde kullanılır.
}

+font-size:  td{font-size:12px;}
+font-weight: p{font-weight:bolder;} –> kalınlık incelik 100 -900 arası veya bold bolder normal  deÄŸerleride alır.
+font-style:  p {font-style:italic;} –> italic ,normal,oblique,inherit deÄŸerleri alır.
+font-variant: span{font-variant:small-caps} –>normal ,small-caps deÄŸerlerini alır.

css-liste özelliği
+list-style-type:disc,circle,square,decimal,lower-roman,upper-roman değerleri alır.

ul.arabalar
{
list-style-stype:none;
}

ol ol ol {
list-style-type:lower-roman —-> i-ii-iii-iv-v gibi
}

+list-style-image
ul{
list-style-image:url(ornek.gif);
}
+list-style:

ul { list-style:disc outside}
ol{ list-style:decimal inside}

+white-space : normal–>birden fazla boÅŸluÄŸu tek boÅŸluk sayar.
pre—> birdenfazla boÅŸluÄŸu birleÅŸtirmez.
nowrap—-> <br> etiketi hariç alt satıra geçirmez.
p{
white-space:pre;
}

css-border özelliği
+border-style:none,hidden,dotted,dashed,solid,double,groove,ridge,inset,
outset,{1,4},inherit

p.icerik{
border-style:solid;
}

+border-width:kenarlık kalınlığı
p{
border-style:solid;
border-width:1px;
}
+border-color:
p{
border-style:solid;
border-color:red;
}
css-margin ve padding

margin-elementin kenarlara olan boÅŸluÄŸu
p{
margin-right:5px; —> saÄŸa olan uzaklığı 5px demek.
}

margin-top,margin-left,margin-right,magin-bottom diÄŸer deÄŸerleri

padding-içerik alanı ile kenarlık arasındaki mesafe

p{
pading:12px;
}

padding-top,right,left,bottom diÄŸer deÄŸerleri

css-görünüm

+overflow:

.visible:kutu sınırları dışına taşan alanı gösterir.

.hidden:kutu sınırları dışına taşan alanı gizler

.scroll:kutu sınırları dışına taşan alana kaydırma çubuğu ile ulaşmamızı sağlar.
.auto:srcoll ile aynı özelliğe sahiptir.

+clip:kırpma

.resim{
position:absolute;
clip:rect(50px 130px 153px 40px)
}

html kodu;
<div class=”resim”>
<img src=”resim.jpg”> alt=”avatar” />
</div>

Bu kısımda burda bitti.Tabiki özellikler bunlarla sınırlı değil.İlerledikçe önümüze gelen diğer özelliklerden de bahsedicem.