10
Kasım

Yazan: WEBMASTERYOLCU  |  Kategori: Uygulamalı Html Dersleri  |  Okunma: 20.792 Defa

Merhaba arkadaşlar gazi Mustafa Kemal Atatürkün ölüm yıl dönümünde ona şükranlarımızı bir kez daha sunuyorum şuan esaret altında olmadan ve şuan kendimize geliştirme imkanı bulabiliyorsak bugünlere gelmemizi sağlayan şehit ve gazilerimiz sayesinde olduğu aşikardır Allah Razı olsun vatanımızın bugünlere gelmesinde emeği geçenlere şehitlerimizinde ruhları şad olsun

Geçelim dersimizi bu dersimizde son olarak tabloları ele alacaz tablo Cellspacing ve CellPadding uygulamasını görüp bir sonraki dersimiz artık web tasarım uygulamaları olacak öncelikle bir önceki dersimizi hatırlayalım inceleme imkanı bulamayan arkadaşlar için .

Bir Önceki Ders: Web Tasarım Dersleri Tablo Hücrelerini Birleştirme Ders 15

Cellspacing

Cellspacing etiketi arkadaşlar tablo içerisinde yer alan hücreler ve tablo kenarlığı arasındaki belirlemeye yarar Cellspacing değer olarak sadece pixel yönünden değer atanabilir.

Cellspacing Uygulaması

Aşağıdaki uygulamalarda ilk örnekteki tablo Cellspacing değeri 5 ve 2. örnek olarak Cellspacing 20 değeri verecem aradaki farkı anlamak için sizde aynı uygulamayı yapın arkadaşlar aşağıdaki kodları boş bir not defteri ile yazıp farklı kaydet diyerek dosya adı tabloyukseklik1.html olarak kaydedin.

<html>
<head>
<title>Web Tasarım Dersleri Cellspacing Uygulaması Ders 16 </title>
</head>
<body>

<table border=”1″ cellspacing=”5″ bordercolor=”#FF0000″>
<tr align=”center”>
<td width=”100″>Ana Sayfa</td>
<td width=”100″>Hakkımızda</td>
<td width=”100″>Ürünler</td>
<td width=”100″>İletişim</td>
</tr>
</table>

</body>
</html>

Html Cellspacing Uygulaması 5 Piksel

Html Cellspacing Uygulaması 5 Piksel

2. Cellspacing Örneği

<html>
<head>
<title>Web Tasarım Dersleri Cellspacing Uygulaması Ders 16 </title>
</head>
<body>

<table border=”1″ cellspacing=”20″ bordercolor=”#FF0000″>
<tr align=”center”>
<td width=”100″>Ana Sayfa</td>
<td width=”100″>Hakkımızda</td>
<td width=”100″>Ürünler</td>
<td width=”100″>İletişim</td>
</tr>
</table>

</body>
</html>

Evet arkadaşlar örneğimizde ilkinde cellspacing değeri 5 verdik ve 2. örnek 20 verdik 2. örnekte hücrelerin tablo kenarlıklarından nasıl uzaklaştığı net görünmektedir buradaki işlem hücre ile gerçekleşti aşağıda anlatacağım işlemse sadece hücre içindeki verileri etkileyecek.

Cellpadding

Cellpadding etiketi arkadaşlar tablo hücreleri içinde yer alan yazı, resim türü içeriğimizin hücre kenarlıkları ile içeriğin arasındaki mesafeyi Cellpadding ile ayarlanabilir piksel cinsinden değer verebiliriz.

Cellpadding Uygulaması

Yukardaki gibi yine 2 örnek yapacam arkadaşlar değer olarak ilk örnekte 5 diğer örnekte 20 piksel vereceğim sizlerde not defterinizde uygulayıp deneyin.

<html>
<head>
<title>Web Tasarım Dersleri Cellpadding Uygulaması Ders 16 </title>
<meta http-equiv=”Content-Type” content=”text/html; charset=iso-8859-9″></head>
<body>

<table border=”1″ cellpadding=”5″ bordercolor=”#FF0000″>
<tr align=”center”>
<td width=”100″>Ana Sayfa</td>
<td width=”100″>Hakkımızda</td>
<td width=”100″>Ürünler</td>
<td width=”100″>İletişim</td>
</tr>
</table>

</body>
</html>

Cellpadding Uygulaması

Cellpadding Uygulaması

2. Örnek yukardaki örnekten tek farkı değerin 5ten 20ye çekilmesi

Cellpadding Uygulaması

Cellpadding Uygulaması

Evet arkadaşlar Cellpadding uygulamamızda değer arttıkça hücre içnde yer alan yazı veya resimler hücre kenarlıklarından uzaklaştığı görülmektedir.

Bugünkü dersimiz bu kadar arkadaşlar bir sonraki dersimiz ise artık proje uygulamaları olacak çerçeveler ile başlayacaz Allahın izniyle.

Derslerimi dilediğiniz yerde yayınlayabilir www.webmasteryolcu.com şeklinde kaynak belirterek

 

 



   Paylaş

4 Yorum yapılmış

  • huseyin
    13 Kasım 2010 | Cevapla

    http://www.balikesirdursunbey.com/ bu sitede ana sayfa yok ana sayfa eklemem için admin panelinden nerey yapıştırmam lazım bu yazıyı teşekkürler

    • 15 Kasım 2010 | Cevapla

      Şimdi hocam kullanmış olduğunuz sistem wordpress temalar her biri farklı kodlama yapısına sahiptir onedenle header.php sayfası kodlarını görmeden konuşmak zor

  • huseyin
    23 Kasım 2010 | Cevapla

    header js php:bu kısım var bu kısımdan bahsadiyorsun heralde(bu kısımamı müdahele etmem gerekir,

Yorum yapın