CSS Bosluk
CSS Bosluk nicelikleri ile HTML elemanı ile onu
çevreleyen sınır/çerçeve arasındaki boşluğu ayarlayabilirsiniz.
Örnekler
Örnek 1
<html>
<head>
<style type="text/css">
td.bir {padding:1.5cm}
td.iki {padding-left:2.5cm;padding-right:2.5cm;
padding-bottom:0.5cm;padding-top:0.5cm; }
</style>
</head>
<body>
<table border="1">
<tr>
<td class="bir">
Bu hucrenin cercevesi ile arasinda esit bosluklar var
</td>
</tr>
</table>
<br />
<table border="1">
<tr>
<td class="iki">
Bu hucrede alt ve ust icin 0.5 cm, sag ve sol icin 2.5 cm bosluk var
</td>
</tr>
</table>
</body>
</html>
Örnek 2
<html>
<head>
<style type="text/css">
td.bir {padding-top:2.5cm;}
</style>
</head>
<body>
<table border="1">
<tr>
<td class="bir">
Bu hucrenin cercevesi sadece ust boslugu var
</td>
</tr>
</table>
</body>
</html>
Örnek 3
<html>
<head>
<style type="text/css">
td{padding-top:
10%;}
</style>
</head>
<body>
<table border="1">
<tr>
<td>
Bu hucrenin cercevesi sadece ust boslugu var
</td>
</tr>
</table>
</body>
</html>
Örnek 4
<html>
<head>
<style type="text/css">
td{padding-bottom:2.5cm;}
</style>
</head>
<body>
<table border="1">
<tr>
<td>
Bu hucrenin cercevesi sadece alt boslugu var
</td>
</tr>
</table>
</body>
</html>
Örnek 5
<html>
<head>
<style type="text/css">
td{padding-bottom:10%;}
</style>
</head>
<body>
<table border="1">
<tr>
<td>
Bu hucrenin cercevesi sadece alt boslugu var
</td>
</tr>
</table>
</body>
</html>
Örnek 6
<html>
<head>
<style type="text/css">
td{padding-left:2.5cm;}
</style>
</head>
<body>
<table border="1">
<tr>
<td>
Bu hucrenin cercevesi sadece sol boslugu var
</td>
</tr>
</table>
</body>
</html>
Örnek 7
<html>
<head>
<style type="text/css">
td{padding-left:10%;}
</style>
</head>
<body>
<table border="1">
<tr>
<td>
Bu hucrenin cercevesi sadece sol boslugu var
</td>
</tr>
</table>
</body>
</html>
Örnek 8
<html>
<head>
<style type="text/css">
td{padding-right:2.5cm;}
</style>
</head>
<body>
<table border="1">
<tr>
<td>
Bu hucrenin cercevesi sadece sag boslugu var
</td>
</tr>
</table>
</body>
</html>
Örnek 9
<html>
<head>
<style type="text/css">
td{padding-right:10%;}
</style>
</head>
<body>
<table border="1">
<tr>
<td>
Bu hucrenin cercevesi sadece sag boslugu var
</td>
</tr>
</table>
</body>
</html>
Sonraki ders için tıklayınız...
Copyright © 2005 Uzerine.com