Kayan Menü Nasıl Yapılır

İçindekiler:

Kayan Menü Nasıl Yapılır
Kayan Menü Nasıl Yapılır

Video: Kayan Menü Nasıl Yapılır

Video: Kayan Menü Nasıl Yapılır
Video: CSS ile Açılır (dropdown) Menü Yapımı 2024, Mayıs
Anonim

Web sitesi ve yazılım geliştirmenin en önemli yönlerinden biri menü oluşturmadır. Güzel bir kayan menü, birçok web sitesi sahibi ve programcısı için bir ölçüt olmaya devam ediyor. Bu, CSS ve Expression Web araçları kullanılarak yapılabilir.

Kayan menü nasıl yapılır
Kayan menü nasıl yapılır

Talimatlar

Aşama 1

Expression Web'i açın ve bir kayan menü oluşturmaya başlamak için Stili Yönet'e gidin ve Yeni Stil tuşuna basın. Yeni stile Selector ul li adını verin. Oluşturulan dosyanın drop-down.css uzantısına sahip olduğundan emin olun. Kayan bir menü oluşturmak için ekranda uygun konumu belirtin. Menü öğelerinin her birinin genişliğini belirleyin ve önlerinde olabilecek gereksiz noktaları kaldırın.

Adım 2

Düzen seçeneğini çalıştırın ve Görüntü özniteliğini ayarlayın. Ekranda hizalaması için uygun bir Satır içi değeri verin. Float niteliğini Left olarak ayarlayın ve Apply tuşuna basın. Listenin tüm öğelerini bir satıra ayarlayın. Bunları düzgün bir sırada tutmak ve çakışmamak için Genişlik özelliğini 150 piksel biçiminde Konum olarak ayarlayın. Listedeki tüm öğelerin aynı boyutta olduğundan emin olun. Liste özniteliğine gidip Liste Stili türünü Yok olarak ayarlayarak her öğenin önündeki noktaları kaldırın. Değişiklikleri kabul etmek ve yürürlüğe girmek için "Tamam" ı tıklayın.

Aşama 3

Ul li için stili ve yazı tipi boyutunu ayarlayın. Stilleri Yönet'e gidin ve ul li'ye sağ tıklayın, Stili Değiştir'i seçin. Zaten tanıdık olan diyalog menüsünü göreceksiniz. Yazı Tipi'ne gidin, Yazı Tipi ailesini seçin ve bu özelliği Helvetica, Arial, Sans-serif olarak ayarlayın. Yazı tipi boyutunu ayarlayın ve 0, 9'a ayarlayın. Metin dönüştürme özelliğini Büyük Harf olarak ayarlayın. Yükseklik - Konum özniteliğinde, değeri 30 piksele ayarlayarak menü öğelerinin tam yüksekliğini belirtin.

4. Adım

Tüm düzeltici eylemler tamamlandığında dosyayı menu.html olarak kaydedin. Az önce oluşturduğunuz menüyü çeşitli uygulamalarda ve tarayıcılarda test edip çalışıp çalışmadığını kontrol edin. Gördüğünüz gibi, böyle bir menü oluşturmak zor değil.

Önerilen: