Yayınlanmış Yazılar
TekHost.Net > TekHost Destek Sistemi > Yayınlanmış Yazılar

Css Text Özellikleri ve Kullanılımı

Yazı içeriği Bu yazımızda css 'TEXT' yani 'METİN BİÇİMLENDİRME' özelliklerinden bahsedeceğiz. Daha kolay anlatmak gerekirse 'paragraf düzeni' de diyebiliriz.

Paragraf içerisindeki uyumu, metin rengini, karakterler arasındaki boşluğu, satır başlarında bırakacağımız girintiyi nasıl ayarlayacağımızı bu yazıda anlatmaya çalışacağız.



1-) METİN RENGİ

Renk özelliği metnin rengini ayarlamak için kullanılır. İçeriğimizdeki yazıya 3 türlü renk verebiliriz.

•name - bir renk ismi yazarak, Örn/ kırmızı rengi için "red" yazmamız gerekir.
Css kodu bu şekilde: {color:red;}

•RGB - RGB değeri vererek, Örn/ "rgb(255,0,0)"
Css kodu bu şekilde: {color:rgb(255,0,0);}

•Hex - Renk kodu kullanarak, Örn/ beyaz renk kodu "#ffffff"
Css kodu bu şekilde: {color:#00ff00;}


Örnek kullanım için bu linke tıklayınız: http://www.w3schools.com/css/tryit.asp?filename=trycss_color





2-) METİN HİZALAMA

'text-align' ile metnimizi hizalarız. Örnek kodlar;

text-align : center; bu kod metni ortalamaya yarar.
text-align : left; bu kod metni sola yaslar.
text-align : right; bu kod metni sağa yaslar.
text-align:justify; bu kod metni iki yana yaslar.

Örnek kullanım için bu linke tıklayınız: http://www.w3schools.com/css/tryit.asp?filename=trycss_text-align_all





3-) METİN DEKORASYONU
'text-decoration' ile ebeveyne ait olan kodların etkisinden kurtarmak için böyle bir kod kullanılır. Daha çok kelimenin altının üstünün çizili olup olmayacağını belirlemek için kullanılır.

Örnek Kodlar;

text-decoration: overline; Kelimenin üstünün (Satır üstünden) çizili olmasını sağlar
text-decoration: line -through; Kelimenin ortasından çizili olmasını sağlar.
text-decoration : underline; Kelimenin altının (Satır altından) çizili olmasını sağlar.
text-decoration: blink; Kelimenin yanıp sönmesini sağlar.(Netscape için i.explorer gibi tarayıcılarda çalışmaz).

Örnek kullanım için bu linke göz atabilirsiniz: http://www.w3schools.com/css/tryit.asp?filename=trycss_text-decoration





4-) HARF ÖZELLİKLERİ
'text-transform' kullanmış olduğumuz metin içerisindeki harflerin dönüşümünü yapar. Küçük harfleri büyük harfe çevirebilir, büyük harfleri küçük yapabilir. Kullanmış olduğumuz metnin ilk harfinin büyük olmasını sağlayabilir.

Örnek Kodlar;

text-transform:uppercase; metnin tamamını büyük harfe dönüştürür.
text-transform:lowercase; metnin tamamını küçük harfe dönüştürür.
text-transform:capitalize; metnin ilk harfinin büyük olmasını sağlar.

Örnek kullanım linki: http://www.w3schools.com/css/tryit.asp?filename=trycss_text-transform





5-) PARAGRAF BAŞI METİN GİRİNTİSİ AYARLAMA
'text-indent' metnin ilk satırından girinti vermek için kullanılır.

Örnek kod;
text-indent : 50px ; Paragraf başlarında 50px boşluk bırakmaya yarar.

Örnek kullanım linki: http://www.w3schools.com/css/tryit.asp?filename=trycss_text-indent




ETİKETLER: css text, css kodu, css text color, css text underline, text-align, align text, text transform css, text-indent, text-decoration, css text decoration, text center, css kodları, td css, tr css, css öellikleri, css properties, css width, css hight, css alt, css kodları ve anlamları, kullanılışları, css kullanışı.
 
Sizce bu bilgiler faydalı mı? evet / hayir
Yazı detayları
Yazı ID: 52
Kategori: Css Kodları, Kodların Kullanımı ve Türkçe açıklaması
Mesaj Tarihi: 2010-07-26 04:47:26
Görüntüleme: 58
Popülerlik (Oylama): Article rated 5.0/5.0 (1)

 
<< Geri Git

TekHost Destek Sistemi