Κεφάλαιο 9 : Ιδιότητες κειμένου

Χρώμα

Μπορείτε να μεταβάλετε το χρώμα του κειμένου σας χρησιμοποιώντας την ιδιότητα color όπως στο παράδειγμα που ακολουθεί :

color : value;

Και οι τιμές που μπορείτε να εισάγετε είναι οι ακόλουθες:

Όνομα χρώματος – για παράδειγμα red, green, blue, yellow
Μια δεκαεξαδική τιμή – για παράδειγμα #F0A, #FFAA00
Μια τιμή RGB – για παράδειγμα rgb(172.64.37) ή rgb(0, 74, 255)

Απόσταση χαρακτήρων

Για να ελέγξετε την απόσταση των χαρακτήρων σε ένα κείμενο μπορείτε να χρησιμοποιήσετε την ιδιότητα letter-spacing. Σε αυτή την ιδιότητα μπορείτε να ορίσετε τόσο θετικές τιμές όσο και αρνητικές. Η σύνταξη αυτής της ιδιότητας είναι η ακόλουθη:

letter-spacing:  value;

ενώ οι τιμές που μπορεί να δεχτεί είναι οι ακόλουθες :

normal – ισοδύναμο με το 0
Ένα αριθμό και μια μονάδα μέτρησης

Ταξινόμηση κειμένου

Αν θέλετε να αλλάξετε την ταξινόμηση του κειμένου στη σελίδα σας μπορείτε να χρησιμοποιήσετε την ιδιότητα text-align όπως στο παράδειγμα που ακολουθεί :

text-align : value;

και οι τιμές που μπορεί να δεχτεί είναι οι ακόλουθες :

left
right
center
justify

Διακόσμηση κειμένου

Ένας άλλος τρόπος για να αλλάξετε την μορφή το κειμένου σας είναι να τον διακοσμήσετε με τη βοήθεια της ιδιότητας text-decoration χρησιμοποιώντας την όπως στο παράδειγμα που ακολουθεί :

text-decoration : value;

ενώ οι τιμές που μπορεί να δεχτεί είναι οι ακόλουθες:

none
underline
overline
linethrough
blink

Εσοχή κειμένου

Για να μπορέσετε να δημιουργήσετε εσοχή στην πρώτη γραμμή του κειμένου σας θα πρέπει να χρησιμοποιήσετε την ακόλουθη ιδιότητα:

text-indent : value;

ενώ οι τιμές που μπορεί να δεχτεί είναι οι ακόλουθες:

Μία τιμή με μια μονάδα μέτρησης
Μια τιμή σε ποσοστιαίες μονάδες.

Μετασχηματισμός κειμένου

Για να ελέγξετε το μέγεθος των χαρακτήρων του κειμένου σας μπορείτε να χρησιμοποιήσετε την ιδιότητα text-transform όπως στο παράδειγμα που ακολουθεί :

text-transform : value;

και οι τιμές που μπορεί να δεχτεί είναι οι ακόλουθες

none
capitalize
lowercase
uppercase

Κενός χώρος

Αν θέλετε να ελέγξετε τον κενό χώρο σε ένα στοιχείο της HTML τότε μπορείτε να χρησιμοποιήσετε την ιδιότητα white-space όπως στο παράδειγμα που ακολουθεί :

white-space : value;

και οι τιμές που μπορεί να δεχτεί είναι οι ακόλουθες

normal
pre
nowrap

Κενό μεταξύ λέξεων

Μπορείτε αν θέλετε να ρυθμίσετε το κενό που θα υπάρχει ανάμεσα από τις λέξεις χρησιμοποιώντας την ιδιότητα word-spacing όπως στο παράδειγμα που ακολουθεί :

word-spacing : value;

οι τιμές που μπορεί να δεχτεί είναι οι ακόλουθες

normal
Μία αριθμητική τιμή με μια μονάδα μέτρησης.

Προηγούμενο : CSS Padding
Επόμενο : CSS Γραμματοσειρές