Yetkili HTML kodu ve basit CSS kuralları yardımıyla bir açılır menü oluşturabilir, onu tamamlayabilir ve değiştirebilirsiniz. Basamaklı tablolar ve işaretleme dili araçlarını kullanarak, menünün kendisinin tüm tarayıcılarda doğru şekilde çalışmasını sağlayabilirsiniz.
Talimatlar
Aşama 1
Önce temel menü çubuğunu tutun. Bir metin düzenleyicide alt menü içeren özel bir numaralandırılmış liste oluşturun. Genellikle bu amaçlar için "Not Defteri" kullanılır. Alt menü, ana listenin bir öğesi olarak işlev görür. Örneğin: Birinci ElemanSel ElemanıSel Elemanı2Alan Elemanı3Alan Elemanı4Alan Elemanı5
Adım 2
Bu listeyi ayrı bir html dosyasına kaydedin. Ardından bir.css dosyası oluşturun. Gerekli tüm stil sayfası parametrelerini girin. Bunu çok dikkatli yapın, çünkü bir hata ve açılır menü doğru görüntülenmez veya hiç çalışmaz.
Aşama 3
Madde işareti listesinde uygulanan tüm madde işaretlerini ve dolguyu kaldırın. Menünün genişliğini CSS araçlarını kullanarak ayarlayın: ul -style: none; width: 200px; }
4. Adım
Listedeki tüm öğelerin göreceli konumunu, position: ul li: göreceli; }
Adım 5
Ardından, fare imleci öğenin üzerine geldiğinde öğeleri ana menüden sağda görünecek olan alt menüyü düzenleyin: li ul: mutlak; sol: 199 piksel; top: 0; görüntü: yok; }
6. Adım
Sol öznitelik, menünün kendisinin genişliğinden bir piksel daha azdır. Bu, açılır öğelerin çift kenarlık oluşturmadan doğru şekilde konumlandırılmasını sağlar. Display özelliği, sayfa açılırken alt menüyü gizlemek için kullanılır.
7. Adım
Uygun css seçeneklerini kullanarak bağlantıları gerektiği gibi biçimlendirin. Display:block parametresini dahil edin, böylece linkler kendilerine ayrılan tüm alanı kaplar. Fare imleci üzerindeyken menünün görünmesini sağlamak için aşağıdaki kodu girin: li: hover ul: blok; }
8. Adım
Liste öğelerini ve bağlantılarını istediğiniz gibi görüntülemek için ek seçenekleri ayarlayın..html dosyasına bir öznitelik ekleyin. Açılır menü kullanıma hazırdır.