Css Dersleri 2 - Css Metin Düzenleme,Metini Özelleştirme

Home » CSS » Css Dersleri 2 - Css Metin Düzenleme,Metini Özelleştirme

Bu makalemde sizlere Css le metinlere ne özellikleri verebiliriz ne özellikleri var onları göstereceğim.

Konu1 : Herhangi bir metinin rengini ayarlayın Renk özelliği metnin rengini ayarlamak için kullanılır. CSS ile, bir renk, en sık belirtilir: "# ff0000" gibi - bir HEX değeri gibi "rgb (255,0,0)" - RGB değeri "kırmızı" gibi - bir renk ismi
<html><head><style>body {color: red; } h1 {color: #00ff00;} p.ex {color: rgb(0,0,255);} </style></head><body> <h1>This is heading 1</h1><p>Bu paragraf kırmızı renktir.</p><p class="ex">Bu paragraf mavi renktir.</p></body>	Başlık 1 Bu paragraf kırmızı renktir. Bu paragraf mavi renktir.

Konu2 : Metin Hizalama Text-align özelliği bir metnin yatay hizalamasını ayarlamak için kullanılır. Metin merkezli, ya da sağ veya sol, ya da haklı hizalanmış olabilir. Text-align "haklı" olarak ayarlandığında her satır eşit genişliğe sahip, böylece her satır gerilir, ve sol ve sağ kenar boşlukları düz.
<html><head><style>h1 {text-align: center;} p.date {text-align: right;} p.main {text-align: justify;} </style></head><body> <h1>CSS Metin Örneği</h1><p class="date">May, 2009</p><p class="main">In my younger and more vulnerable years my father gave me some advice that I've been turning over in my mind ever since</p></body></html>	CSS Metin Örneği May, 2015 In my younger and more vulnerable years my father gave me some advice that I've been turning over in my mind ever since. '

Konu3 : Linklerin altındaki çizgiyi kaldırın. Text-decoration özelliği ayarlamak veya metinden dekorasyonları kaldırmak için kullanılır. Text-decoration özelliği çoğunlukla tasarım amaçlı linklerden alt çizgiler kaldırmak için kullanılır.
<html><head><style>a { text-decoration: none; } </style></head><body> <p>Link: <a href="http://kodblogcum.blogspot.com">Kodblogcum.blogspot.com</a></p></body></html>	Link : kodblogcum.blogspot.com

Konu 4 : Metin süsleme,üstü çizili,ortası çizgili,altı çizili

Başlık 1

Başlık 2

Konu 5 : Metin harflerini kontrol edin, kelimenin hepsi büyük olsun, kelimenin hepsi küçük olsun, kelimenin sadece baş harfleri büyük olsun. Metin dönüşümü kelimelerin metinde büyük veya küçük harflerlerle başlaması için kullanılır.
<head><style>p.uppercase {text-transform: uppercase;} p.lowercase {text-transform: lowercase;} p.capitalize {text-transform: capitalize;} </style></head><body> <p class="uppercase">Yeni Metin 1</p><p class="lowercase">Yeni Metin 2</p><p class="capitalize">Yeni Metin 3</p></body></html>	Yeni Metin 1. Yeni Metin 2 Yeni Metin 3.

Karakterleri arasındaki boşluğu belirtin
Bu örnek karakterler arasındaki boşluğu azaltmak için kullanılır.

Kelimeler arasındaki beyaz boşluğu belirtin Bu örnek, bir paragraftaki kelimeler arasında beyaz alanı artırmak veya azaltmak için kullanılır.
<html><head><style>p { word-spacing: 30px;} </style></head><body> <p>This is some text in a paragraph.</p></body></html>	This is some text in a paragraph.

Css Metin Etiketleri ve Anlamları

Metinlerle ilgili Css etiketleri ve anlamları
Özellik	Açıklama
text-decoration:	Linkin altının,üstünün vs. çizgili olup olmayacağını belirler.
text-decoration: none:	Linkin altının çizili olmamasını sağlar.
text-align:	Metnin dikey olarak nasıl hizalanacağını belirler.
left:	Metni sola yaslar.
right:	Metni sağa yaslar.
justify:	Metni iki yana yaslar.
center:	Metni ortalar.
text-transform:	Kelimelerin büyük harf veya küçük harflerden oluşmasını sağlar.
overline :	Kelimenin üstünün (Satır üstünden) çizili olmasını sağlar.
uppercase:	Kelimelerin bütün harflerinin büyük olmasını sağlar.
line-through:	Kelimenin ortasından çizili olmasını sağlar.
underline:	Kelimenin altının (Satır altından) çizili olmasını sağlar.
lowercase:	Kelimelerin bütün harflerinin küçük olmasını sağlar.
capitalize:	Kelimelerin ilk harflerinin büyük olmasını sağlar.
text-text-indent:	Metnin ilk satırının soldan ne kadar içerden başlayacağını belirler.