Πώς να δημιουργήσετε: Μενού κατώτερης πλοήγησης

Μάθετε πώς να δημιουργήσετε ένα μενού κατώτερης πλοήγησης χρησιμοποιώντας CSS.

Προσπάθησε προσωπικά

Δημιουργία μενού κατώτερης πλοήγησης

Βήμα 1 - Προσθήκη HTML:

<div class="navbar">
  <a href="#home" class="active">Επίσημη Σελίδα</a>
  <a href="#news">Ειδήσεις</a>
  <a href="#contact">Επικοινωνία</a>
</div>

Βήμα 2 - Προσθήκη CSS:

/* Τοποθέτηση του μενού πλοήγησης στο κάτω μέρος της σελίδας και καθιέρωση σταθερής θέσης */
.navbar {
  χρώμα-υποβάθρου: #333;
  περιστροφή: κρυφή;
  θέση: σταθερή;
  κάτω: 0;
  πλάτος: 100%;
}
/* Ρύθμιση στυλ συνδέσμων στο μενού πλοήγησης */
.navbar a {
  πλεονέκτημα: αριστερά;
  προσθήκη-μορφής: block;
  χρώμα: #f2f2f2;
  καθορισμός-κεντρώματος-tekstu: κέντρο;
  χώρος-πληρωμής: 14px 16px;
  απόκρυψη-διακόσμησης: none;
  πλάτος-γραμματοσειράς: 17px;
}
/* Αλλαγή χρώματος του συνδέσμου όταν ο αριθμός ποντικιού είναι πάνω του */
.navbar a:hover {
  χρώμα-υποβάθρου: #ddd;
  χρώμα: μαύρο;
}
/* Προσθήκη χρώματος για ενεργό/τρέχον σύνδεσμο */
.navbar a.active {
  χρώμα-υποβάθρου: #04AA6D;
  χρώμα: λευκό;
}

Προσπάθησε προσωπικά

Σχετικές σελίδες

Εκμάθηση:Ναυτιλία CSS

Εκμάθηση:Πώς να δημιουργήσω: Απάντα αναποδινητή κάτω μενού