Γράφοντας HTML | Σχετικά | Παραπομπές | Ετικέτες |Μαθήματα | Προηγούμενο | Επόμενο |

20. Οριζόντιες Γραμμές


Οι πρώτες "επεκτάσεις" στην HTML απο την Netscape παρείχαν ορισμένες παραπάνω επιλογές μορφοποίησης για την ετικέτα <hr> (Horizontal Rule) - δες Μάθημα 4 . Εξ'ορισμού, ο browser της Netscape εμφάνιζε την οριζόντια μονοκόματη διαχωριστική γραμμή με μια τρισδιάστατη προοπτική, αντί σαν μια απλή γραμμή.

Πάχος Γραμμής

Το πρώτο χαρακτηριστικό έχει σαν αποτέλεσμα την εμφάνιση γραμμών με διαφορετικό πάχος, χρησιμοποιόντας την επιλογή:

<hr size=N>

όπου Ν είναι το πάχος της οριζόντιας γραμμής σε pixels. Ας δούμε ορισμένα παραδείγματα:

sample web page
<hr size=2> όμοια με την <hr> :

<hr size=8> :


<hr size=20> :


Μήκος Γραμμής

Αλλή μια επιλογή μορφοποίησης για την ετικέτα <hr> επιτρέπει να ορίσουμε το μήκος της οριζόντιας γραμμής - η οποία δεν είναι αναγκαστικό να καταλαμβάνει όλο το μήκος της οθόνης. Αυτό γίνεται ώς εξής:

<hr width=X>
<hr width=Z%>

όπου Χ είναι ένας αριθμός που δηλώνει το μήκος σε pixels και Ζ είναι το μήκος της γραμμής σε ποσοστό σε σχέση με τη σελίδα. Σε γενικές γραμμές καλύτερα είναι να χρησιμοποιείτε το ποσοστό, καθώς έτσι η οριζόντια γραμμή προσαρμόζεται στο μήκος του παραθύρου που χρησιμοποιεί ο κάθε χρήστης.

Ας δούμε ορισμένα παραδείγματα :

sample web page
<hr width=80 size=10> :

<hr width=80% size=10> :


Σημείωση: Δοκιμάστε να μεγαλώσετε και/ή να μικρύνετε το πλάτος του παρυθύρου του web browser που χρησιμοποιείτε, για να δείτε τη διαφορά ανάμεσα στον καθορισμό του μήκους σε απόλυτο μέγεθος (width=80) σε σύγκριση με το μέγεθος σε ποσοστό (width=80%)

sample web page
<hr width=40% size=10> :

<hr width=5% size=10> :


Χωρίς Σκίαση

Τελειώνοντας, μπορεί να υπάρξει περίπτωση όπου δε θα θέλετε τη σκίαση που δίνει την 3-στατη εμφάνιση στη γραμμή. Η απαλοιφή της σκιάς είναι πολλή απλή, όπως φαίνεται και στα παραδείγματα:

sample web page
<hr width=60% size=6 noshade> :

<hr width=60% size=1 noshade> :



Στη συνέχεια: 21. Επιπλέον Συστοίχιση

Γράφοντας HTML | Σχετικά | Παραπομπές | Ετικέτες |Μαθήματα | Προηγούμενο | Επόμενο |