Einer der wichtigsten Aspekte der Website- und Softwareentwicklung ist die Menüerstellung. Ein schönes Schiebemenü bleibt für viele Website-Besitzer und Programmierer ein Maßstab. Dies kann mit CSS- und Expression Web-Tools erfolgen.
Anleitung
Schritt 1
Öffnen Sie Expression Web und gehen Sie zu Stil verwalten, um mit der Erstellung eines Schiebemenüs zu beginnen, und drücken Sie die Taste Neuer Stil. Benennen Sie den neuen Stil Selektor ul li. Stellen Sie sicher, dass die generierte Datei die Erweiterung dropdown.css hat. Um ein Schiebemenü zu erstellen, geben Sie die entsprechende Position auf dem Bildschirm an. Bestimmen Sie die Breite der einzelnen Menüpunkte und entfernen Sie unnötige Punkte, die sich möglicherweise davor befinden.
Schritt 2
Führen Sie die Option Layout aus und legen Sie das Anzeigeattribut fest. Geben Sie ihm einen geeigneten Inline-Wert, um ihn auf dem Bildschirm auszurichten. Setzen Sie das Float-Attribut auf Left und drücken Sie die Apply-Taste. Setzen Sie alle Elemente der Liste auf eine Zeile. Um sie in einer ordentlichen Reihenfolge zu halten und sich nicht zu überlappen, setzen Sie das Width-Attribut auf Position in Form von 150 px. Stellen Sie sicher, dass alle Elemente in der Liste die gleiche Größe haben. Entfernen Sie die Punkte vor jedem Element, indem Sie zum Listenattribut gehen und den Listenstiltyp auf Keine setzen. Klicken Sie auf "OK", um die Änderungen zu übernehmen und wirksam zu werden.
Schritt 3
Passen Sie den Stil und die Schriftgröße für die ul li an. Gehen Sie zu Stile verwalten und klicken Sie mit der rechten Maustaste auf das Ulli und wählen Sie Stil ändern. Sie sehen das bereits bekannte Dialogmenü. Gehen Sie zu Font, wählen Sie Font-family und setzen Sie dieses Attribut auf Helvetica, Arial, Sans-Serif. Passen Sie die Schriftgröße an und setzen Sie sie auf 0, 9. Setzen Sie das Text-transform-Attribut auf Großbuchstaben. Geben Sie im Attribut Höhe - Position die genaue Höhe der Menüelemente an, indem Sie den Wert auf 30 px setzen.
Schritt 4
Speichern Sie die Datei als menu.html, wenn alle Korrekturmaßnahmen abgeschlossen sind. Testen Sie das gerade erstellte Menü in verschiedenen Anwendungen und Browsern, um zu sehen, ob es funktioniert. Wie Sie sehen, ist es nicht schwer, ein solches Menü zu erstellen.
