Υποενότητα 3.1: Πλοήγηση - Εικονίδια
Υποενότητα 3.1: Πλοήγηση - Εικονίδια
- Πλοήγηση - Navigation
- Navigation bars
- Breadcrumbs
- Font Awesome
Icon Fonts
Προσθήκη Font Awsome
Μπορείτε να πάρετε τα Font Awesome χρησιμοποιώντας το npm πληκτρολογώντας τα ακόλουθα στη γραμμή εντολών:
npm install font-awesome --save
Τώρα πρέπει να συμπεριλάβουμε τα αρχεία CSS για τα font awesome και bootstrap-social στο αρχείο index.html. Προσθέστε τον ακόλουθο κώδικα στο head του αρχείου μετά τους συνδέσμους για εισαγωγή κλάσεων CSS Bootstrap:
<link rel="stylesheet" href="node_modules/font-awesome/css/font-awesome.min.css">
Ας χρησιμοποιήσουμε τώρα κάποια εικονίδια στην ιστοσελίδα μας και να τα μορφοποιήσουμε. Ενημερώστε τα στοιχεία της λίστας λίστας navbar ως εξής στο index.html
Παρομοίως, ενημερώστε τα στοιχεία της λίστας λίστας navbar ως εξής, στο aboutus.html:
Next, in both index.html and aboutus.html, go down to the address in the footer of the page and replace the "Tel.", "Fax" and "Email" with the corresponding font awesome based icons as follows:
Στη συνέχεια, και στις δύο index.html και aboutus.html, κατεβείτε στη address στο footer της σελίδας και αντικαταστήστε τα "Tel.", "Fax" και "Email" με τα αντίστοιχα εικονίδια στα εξής:
Αποθηκεύστε όλες τις αλλαγές και commit στο αποθετήριο Git με το μήνυμα "Icon Fonts".