CSS ile Metin Biçimlendirme İşlemleri


Bu yazımızda Web tasarımlarımızda sık kullandığımız CSS ile biçimlendirme işlemini inceleyeceğiz.  Bu iş için text-decoration özelliği üzerinde duracağız.

Aşağıdaki satır ile metin altı veya üüstü çizilmez.
text-decoration: none;

Aşağıdaki satır ile metnin tepesi çizilir.
text-decoration: overline;

Aşağıdaki satır ile metnin altı çizilir.
text-decoration: underline;

Aşağıdaki satır ile metnin tam ortasından çizgi geçişi sağlanır. E-ticaret sitelerinde eski fiyatın üstü çizilirken sık kullanılır. 
text-decoration:  line-through;
 
 
Aşağıdaki örneği Notepad, Notepad++ veya Sublime gibi bir editöre yapıştırıp, dosya uzantısını html veya html olarak kaydediniz.  Örnegin csscizme.html ismi verebilirsiniz. 

<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">
 
<style type="text/css">

   .cizgisiz{text-decoration: none;} 
   .altiCizili{text-decoration: underline;}
   .tepesiCizili{text-decoration: overline;}
   .ortasiCizili{text-decoration: line-through;}
 
</style>
</head>
<body>

<div class="ortasiCizili">ortasi cizili yazı</div>

<div class="cizgisiz">çizgisiz</div>

<div class="tepesiCizili">tepesi çizili yazı</div>

<div class="altiCizili">alti cizili yazı</div>
 
</body>
</html>



Mutlu kodlamalar,
Oğuzhan Taş
 
Bookmark and Share
Dil Değiştir(Change Language)
Kategoriler
Kütüphane Programı
En çok Okunan 18 Makale