Προσθέσετε ένα μενού στο πάνω μέρος μιας σελίδας
Σελίδα 1 από 1 • Μοιραστείτε
- Port Admin
Admin - Αριθμός μηνυμάτων : 2651
Πόντοι : 6380
Ημερομηνία εγγραφής : 06/03/2017 -
Port Admin Τετ Μαρ 08, 2023 12:43 am
Για να προσθέσετε ένα μενού στο πάνω μέρος μιας σελίδας HTML, μπορείτε να χρησιμοποιήσετε την ετικέτα nav σε συνδυασμό με μια λίστα ul και τα στοιχεία της li. Ακολουθεί ένας απλός κώδικας HTML που δημιουργεί ένα μενού στο πάνω μέρος της σελίδας:
Στον παραπάνω κώδικα, ορίζουμε ένα nav στο επίπεδο της κεφαλίδας (header) και εντός αυτού δημιουργούμε μια λίστα ul με τις επιλογές του μενού μας (li). Στον κώδικα CSS, ορίζουμε το background-color του μενού μας και τοποθετούμε τα στοιχεία της λίστας.
- Κώδικας:
<!DOCTYPE html>
<html>
<head>
<title>Σελίδα με μενού</title>
<style>
body {
margin: 0;
padding: 0;
}
nav {
background-color: #333;
overflow: hidden;
}
nav ul {
margin: 0;
padding: 0;
list-style: none;
display: flex;
justify-content: space-between;
align-items: center;
}
nav ul li {
padding: 10px 20px;
}
nav ul li a {
color: white;
text-decoration: none;
}
nav ul li a:hover {
text-decoration: underline;
}
</style>
</head>
<body>
<nav>
<ul>
<li><a href="#">Αρχική</a></li>
<li><a href="#">Προφίλ</a></li>
<li><a href="#">Ρυθμίσεις</a></li>
<li><a href="#">Αποσύνδεση</a></li>
</ul>
</nav>
<h1>Καλώς ήρθατε!</h1>
<p>Αυτή είναι μια σελίδα με ένα μενού στο πάνω μέρος της.</p>
</body>
</html>
Στον παραπάνω κώδικα, ορίζουμε ένα nav στο επίπεδο της κεφαλίδας (header) και εντός αυτού δημιουργούμε μια λίστα ul με τις επιλογές του μενού μας (li). Στον κώδικα CSS, ορίζουμε το background-color του μενού μας και τοποθετούμε τα στοιχεία της λίστας.
__________________
Download: Για να δείτε το κρυφό περιεχόμενο θα πρέπει να σχολιάσετε.
To see hidden content you should comment.
Παρόμοια θέματα
Δημιουργήστε έναν λογαριασμό ή συνδεθείτε για να απαντήσετε
Προκειμένου να απαντήσετε πρέπει να είστε μέλος.
Δημιουργία Λογαριασμού
Ενταχθείτε στην κοινότητά μας δημιουργώντας έναν λογαριασμό. Είναι πανεύκολο!
Δημιουργία ενός νέου Λογαριασμού
Σελίδα 1 από 1
Δικαιώματα σας στην κατηγορία αυτή
Δεν μπορείτε να απαντήσετε στα Θέματα αυτής της Δ.Συζήτησης
