Css Kodları ve Anlamları Nelerdir?

Css Kodları ve Anlamları Nelerdir? Merhaba arkadaşlar, Bu makalemde sizlere CSS Kodlarını ve Anlamlarını anlatacağım, Zaten bildiğiniz bunun gibi temel olmaksızın yani HTML, CSS bilmeden hiç bir şey olmuyor. Şimdi makalemize tam geçmeden kısaca bir CSS’in tanımını yapalım ki unutulan bir şey varsa noksan giderilsin. HTML bize içerik biçimlendirme bölgesinde çok fazla geniş imkanlar sunar. CSS, uzun yazılışıyla Cascading Style Sheets, ve ya Türkçesiyle Stil şablonları ise bunu bir adım daha öteye götürür, bize sayfalarımız için global şablonlar hazırlama olanağı verdiği gibi, tek bir harfin stilini; yani renk, font, büyüklük bu gibi niteliklerini değişim yapmak için de kullanılabilir. Bu tekniğin en önemli niteliği kullanımındaki bu esnekliğidir. Artık konumuza geçebiliriz… ———————————————————————— LİNK ÖZELLİKLERİ a : Linkin, sayfa açıldığında tıklanmadan ve ya ümleç üzerine getirilmeden önceki durumudur. a:hover : Linkin imleç üzerine getirildiğindeki durumudur. a:active : Linkin tıklandığı andaki durumudur. a:visited : Linkin tıklandıktan sonraki durumudur. ———————————————————————— BİÇİMLENDİRME color: Linkin rengini belirler. background-color: Linkin zemin rengini belirler. background-image: Linkin zeminine resim ekler(Bu animated-gif de olabilir.) text-decoration: Linkin altının,üstünün vs. çizgili olup olmayacağını belirler. font-weight: Yazının kalınlık ya da inceliğini belirler. border: Linkin etrafına kenarlık ekler. display: Linki içeren hücre , satır vb. arzulanan yerlerin seçilmesini sağlar. ———————————————————————— LİSTE ÖZELLİKLERİ disk: Liste biçiminin disk (içi dolu daire) biçiminde olmasını sağlar. circle : Liste biçiminin çember halinde olmasını sağlar. square : Liste biçiminin kare olmasını sağlar. decimal : Liste biçiminin rakamlardan oluşmasını sağlar. lower-roman : Liste biçiminin i,ii,iii bu gibi küçük roma rakamlarından oluşmasını sağlar. upper-roman : Liste biçiminin I,II,II benzeri büyük roma rakamlarından oluşmasını sağlar. lower-alpha : Liste biçiminin a,b,c halinde küçük harf olmasını sağlar. upper-alpha : Liste biçiminin A,B,C halinde büyük harf olmasını sağlar. none : Listenin simgesiz olmasını sağlar. inside : Listenin ikinci satırının en soldan başlamasını sağlar. Outside : Listenin ikinci satırının ilk satır ile tıpkı yerden başlamasını sağlar. list-style-image : Liste biçiminin resim olmasını sağlar. ———————————————————————— KATMAN ÖZELLİKLERİ position: Katmanın yerinin belirlenmesini sağlar. absolute: Katmanın yerinin pencere esas alınarak belirlenmesini sağlar. relative: Katmanın yerinin bir önceki katman esas alınarak belirlenmesini sağlar. static: Katmanın yerinin sabit şekilde (Varsayılan olan sol üst köşe) belirlenmesini sağlar. top: Katmanın üstten ne kadar aşağıda olması gerektiğini belirler. left: Katmanın soldan ne kadar içeride olması gerektiğini belirler. width: Katmanın genişliğinin ne kadar olacağını belirler. height: Katmanın yüksekliğinin ne kadar olacağını belirler. overflow: Katmanın belirtilen yükseklik ve genişliğe sığmayan tarafına ne olacağını belirler. auto: Otomatik şekilde belirlenir. scroll: Kaydırma çubuğu ekleyerek görünmesini sağlar. visible : Katmanı belirtilen boyutların dışına taşırarak sığmayan alanların görünmesini sağlar. hidden: Sığmayan bölgeleri gizler. visibility: Katmanın görünebilirlik ayarını yapar. visible : Katmanın görünür olmasını sağlar. hidden: Katmanı gizler. z-index : Katmanların alttan üste doğru hangi dizi ile gösterileceğini belirler.1 kıymeti katmanın en altta olacağını belirtir. ———————————————————————— FONT ÖZELLİKLERİ font-family: Yazı türünü belirler.(Arial , Verdana gibi.) font-style: Yazının normal yada sağa eğik olmasını sağlar. font-variant: Yazının normal yada tümünün büyük harflerden oluşturulmuş olmasını sağlar. font-weight: Yazının kalınlık-inceliğini belirler. font-size: Yazının büyüklüğünü belirler. ———————————————————————— TEXT ÖZELLİKLERİ word-spacing : Kelimeler arasında bırakılacak boşluğu boşluğu belirler. letter-spacing : Harfler bünyesinde bırakılacak boşluğu boşluğu belirler. text-decoration : Kelimenin altının , üstünün vs. çizili olup olmayacağını belirler. underline : Kelimenin altının (Satır altından) çizili olmasını sağlar. overline : Kelimenin üstünün (Satır üstünden) çizili olmasını sağlar. line-through : Kelimenin ortasından çizili olmasını sağlar. blink : Kelimenin yanıp sönmesini sağlar.(Netscape için) vertical-align : Metnin yatay şekilde nasıl hizalanacağını belirler. text-transform: Kelimelerin büyük harf yada küçük harflerden oluşmasını sağlar. capitalize : Kelimelerin ilk harflerinin büyük olmasını sağlar. uppercase : Kelimelerin tüm harflerinin büyük olmasını sağlar. lowercase : Kelimelerin tüm harflerinin küçük olmasını sağlar. none : Kelimelerin orjinal metindeki benzeri olmasını sağlar. text-align: Metnin dikey şekilde nasıl hizalanacağını belirler. left : Metni sola yaslar. right : Metni sağa yaslar. center : Metni ortalar. justify : Metni iki yana yaslar. text-indent : Metnin ilk satırının soldan ne kadar içerden başlayacağını belirler. line-height : Satırın yüksekliğini ayarlar.(Yüksek kıymet verildiğinde satırlar arasındaki boşluk artar.) first-line : Metnin ilk satırının biçimlendirilmesini sağlar. first-letter : Metnin ilk harfinin biçimlendirilmesini sağlar. ———————————————————————— İMLEÇ ÖZELLİKLERİ crosshair: İmlecin artı göstergesi halinde olmasını sağlar. auto: İmlecin metinde dikey çizgi ,boş alanda normal ok halinde olmasını sağlar. default: İmlecin hem metinde hem de boş alanda normal ok halinde olmasını sağlar. hand: İmlecin linkte bulunduğu bu gibi el halinde olmasını sağlar. move: İmlecin atama göstergesi biçiminde olmasını sağlar. ne-resize: İmlecin sağa yatık normal ok olmasını sağlar. nw-resize: İmlecin sola yatık normal ok olmasını sağlar. se-resize: İmlecin yukardan aşağı doğru ve sağa yatık normal ok olmasını sağlar. sw-resize: İmlecin yukardan aşağı doğru ve sola yatık normal ok olmasını sağlar. n-resize: İmlecin aşağıdan yukarıya doğru ince ok halinde olmasını sağlar. s-resize: İmlecin yukardan aşağı doğru ince ok halinde olmasını sağlar. w-resize: İmlecin sola doğru ince ok halinde olmasını sağlar. e-resize: İmlecin sağa doğru ince ok biçiminde olmasını sağlar. text: İmlecin hem metinde hem de boş alanda metinde bulunduğu bunun gibi görünmesini sağlar. wait: İmlecin meşgul animasyonuna dönüşmesini sağlar. help: İmlecin yardım-soru işaretine dönüşmesini sağlar. ———————————————————————— ZEMİN ÖZELLİKLERİ background-color: Zeminin rengini belirler. color : Renk adı. transparent: Zeminin saydam olmasını sağlar. background-image: Zemine resim yerleştirilmesini sağlar. url : Zemine yerleştirilen resmin adresi. background-repeat: Zemine yerleştirilen resmin nasıl yayılacağını belirler. repeat : Resmin tüm zemine yayılmasını sağlar. repeat-x : Resmin sol-üstten sağ-üste doğru yayılmasını sağlar. repeat-y : Resmin sol-üstten sol-alta doğru yayılmasını sağlar. no-repeat: Resmin yayılmadan orjinal boyutuyla görünmesini sağlar. background-attachment: Zemindeki resmin , sayfa kaydırma çubuğuyla devinim ettirildiğindeki durumunu belirler. scroll : Sayfa devinim ettirildiğinde zeminin de kaymasını sağlar. fixed: Sayfa kaydırılsa da zeminin sabit kalmasını sağlar background-position: Zemindeki resmin arzulanan biçimde yerleştirilmesini sağlar. top : Resmi yukarı yerleştirir. center : Resmi ortalar. bottom : Resmi aşağı yerleştirir. left : Resmi sola yerleştirir. right: Resmi sağa yerleştirir. …px : Resmin soldan arzulanan ölçüde içerde olmasını sağlar. ———————————————————————— TABLO ÖZELLİKLERİ margin : Tablo ile pencerenin kenarları arasında bırakılacak boşluğu belirler. margin-top : Tablo ile pencerenin üst kenarı arasında bırakılacak boşluğu belirler. margin-right : Tablo ile pencerenin sağ kenarı bünyesinde bırakılacak boşluğu belirler. margin-bottom : Tablo ile pencerenin alt kenarı bünyesinde bırakılacak boşluğu belirler. margin-left : Tablo ile pencerenin sol kenarı bünyesinde bırakılacak boşluğu belirler. _______________________ padding : Tablo kenarları ile tablo içeriği (Yazı vb.) bünyesinde bırakılacak boşluğu belirler. padding-top : Tablonun üst kenarı ile tablo içeriği bünyesinde bırakılacak boşluğu belirler. padding-right : Tablonun sağ kenarı ile tablo içeriği bünyesinde bırakılacak boşluğu belirler. padding-bottom : Tablonun alt kenarı ile tablo içeriği arasında bırakılacak boşluğu belirler. padding-left : Tablonun sol kenarı ile tablo içeriği arasında bırakılacak boşluğu belirler. _______________________ border : Tablonun kenarlarının şekillendirilmesini sağlar. _______________________ border-top : Tablonun üst kenarının şekillendirilmesini sağlar. border-left : Tablonun sol kenarının şekillendirilmesini sağlar. border-bottom : Tablonun alt kenarının şekillendirilmesini sağlar. border-right : Tablonun sağ kenarının şekillendirilmesini sağlar. _______________________ border-width : Tablonun kenarlarının kalınlığını belirler. border-top-width : Tablonun üst kenarının kalınlığını belirler. border-right-width : Tablonun sağ kenarının kalınlığını belirler. border-bottom-width : Tablonun alt kenarının kalınlığını belirler. border-left-width : Tablonun sol kenarının kalınlığını belirler. _______________________ border-style : Tablonun kenarlık türünü belirler. border-top-style : Tablonun üst kenarlık türünü belirler. border-right-style : Tablonun sağ kenarlık türünü belirler. border-bottom-style : Tablonun alt kenarlık türünü belirler. border-left-style : Tablonun sol kenarlık türünü belirler. _______________________ border-color : Tablonun kenarlarının rengini belirler. border-top-color : Tablonun üst kenarının rengini belirler. border-right-color : Tablonun sağ kenarının rengini belirler. border-bottom-color : Tablonun alt kenarının rengini belirler. border-left-color : Tablonun sol kenarının rengini belirler. _________________________ color : Tabloda geçen metnin rengini belirler. width : Tablonon genişliğini belirler. height : Tablonun yüksekliğini belirler. Arama Terimleri: css kodları, css kodları ve açıklamaları, css nitelikleri ve açıklamaları, bütün html ve css kodlari


Yapılan Yorumlar
Erdem OFLAZ

Bir mum, diğer mumu tutuşturmakla ışığından bir şey kaybetmez.
 Kategoriler
 Popüler yazılar