html dersleri 4 – menü yapımı

Merhaba arkadaşlar, uzun süredir yeni yazı yazmamıştım ama yorumlar gelince  yeniden yazmaya başlamayı düşünüyorum. daha önceki html konularında bazı fonksiyonları göstermiştim ilk 3 dersi inceleyerek bunları görebilirsiniz 4. dersimizde ise örnek olarak html menü‘nün nasıl yapılacağını göstereceğim.

Yalnızca html kullanacağım için biraz basit olacak ancak bu yazı html dersi olduğu için html imkanlarını kullanacağız.

Notlar;
width   = Genişlik

height  = Yükseklik

background = Arka plan

<table>  = Tablo oluştur

<tr>         = Tabloda satır oluştur

<td>        = Tabloda sütun oluştur

<input>  = nesne oluştur


<html>
<head>
<title>Html Dersleri 4</title>
</head>
<body>

<table align="center" width="800" height="40" background="menu.png">
<tr>

<td>
Ana sayfa
</td>

<td>
Menu 2
</td>

<td>
Menu 3
</td>

<td>
İletişim
</td>

<td align="right">
<input type="text"> <input type="submit" value="Ara">
</td>

</tr>
</table>

</body>
</html>

Gördüğünüz üzere bir tablo oluşturup arkaplanına mavi tonlu bir png resmi atıp içerisinde sütunlar oluşturarak menu elemanlarını oluşturduk ve en son da ise bir arama nesnesi ile buton nesnesi oluşturup bu sütunu sağ tarafa kaydırdık böylelikle html menü örneğimizi tamamlamış olduk. bu menulere link vererek o menüye tıklandığında hangi sayfaya gitmesini istiyorsak oraya yönlendirme işlemini de yapabiliriz link örneğini önceki yazımda zaten göstermiştim.

Kodların Browserde Nasıl Görüntüğüne Bakmak İçin Tıklayın
İlgi gördüğü sürece yazılara devam etmeyi düşünüyorum takıldığınız yerleri yorum bölümünden sorabilirsiniz.

21 Şubat 2015
bosluk
jquery kodları Son Yazılar