Σχεδιασμός και Υλοποίηση  Πληροφοριακού Συστήματος βέλτιστης διαδρομής συνεπιβατών που 
χρησιμοποιούν υπηρεσίες Ταξί 

 

34 

 

μορφοποίησης.  Η  γενική  μορφή  ενός  επιλογέα  φαίνεται  στην  παρακάτω  εικόνα 
(Εικόνα 3). 

 

Εικόνα 3: Μορφή δήλωσης επιλογέα CSS. 

 

2.2.3 Font Awesome 

 
 

Για  τη  δημιουργία  ενός  πιο  όμορφου  και  καλοσχεδιασμένου  γραφικού 

περιβάλλοντος (GUI) για το χρήστη, στην παρούσα διπλωματική εργασία, έγινε χρήση 
της δημοφιλούς συλλογής γραμματοσειρών διαδικτυακών εικόνων Font Awesome.  

 

Η Font Awesome παρέχει εικονίδια vectors τα οποία είναι κλιμακούμενα και 

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

 

Η εγκατάσταση της Font Awesome γίνεται είτε χειροκίνητα, κατεβάζοντας  το 

directory και αντιγράφοντάς το στα αρχεία του συστήματος, είτε πολύ πιο απλά μέσω 
CDN (Content Delivery Network - Δίκτυο Παροχής Περιεχομένου). 

 

Η χρήση της είναι πολύ απλή, αφού το μόνο που απαιτείται είναι η προσθήκη 

μίας γραμμής κώδικα στην ιστοσελίδα. Η Font Awesome θα πάρει αυτή την γραμμή 
κώδικα και θα την μετατρέψει σε μια εικόνα, την οποία εύκολα κάποιος μπορεί να 
επεξεργαστεί  σύμφωνα  με  τις  επιθυμίες  του,  πχ  αλλαγή  μεγέθους,  χρώματος  κ.ά.  
Μια  επιπλέον  ενδιαφέρουσα  δυνατότητα  που  προσφέρει  η  συλλογή  αυτή  είναι  η 
δυνατότητα δημιουργίας κινούμενων εικόνων (animate icons). Στην εικόνα (Εικόνα 4) 
παρακάτω παρουσιάζεται ένα παράδειγμα χρήσης της Font Awesome. 

<i

 

class=

"fa fa-taxi"

></i>

 

 

 

Εικόνα 4: Παράδειγμα χρήσης της Font Awesome.

 

Επιλογέας 

Ιδιότητες :

 

:

 Τιμές