Βασικά στοιχεία της HTML > Λίστες

Διατεταγμένη λίστα, Μη διατεταγμένη λίστα, Λίστα ορισμών

Η χρήση λίστας, διατεταγμένης ή μη, σίγουρα προσφέρει στο κείμενο στις περιπτώσεις που εισάγουμε οδηγίες, πίνακες περιεχομένων και γενικά στοιχεία που πρέπει να μπουν σε μια σειρά.

Διατεταγμένη λίστα
Στην διατεταγμένη λίστα χρησιμοποιούμε τους κωδικούς <OL> και </OL> στην αρχή και το τέλος της λιστας ενώ κάθε στοιχείο της λίστας καθορίζεται από τους κωδικούς <LI> και </LI>. Εξ' ορισμού, η διατεταγμένη λίστα χρησιμοποιεί αρίθμηση με αραβικούς αριθμούς (1,2,3,...). Ο κωδικός <OL> δέχεται δύο ορίσματα ενώ ο κωδικός <LI> δέχεται ένα, που μας επιτρέπουν πλήρη έλεγχο της διάταξης. Στον <ΟL>, με το όρισμα TYPE=" " μπρούμε να διαλέξουμε μεταξύ των Α (Α,B,C,...), a (a,b,c,...), I (I,II,III,...), i (i,ii,iii,...) και βέβαια 1 (1,2,3,...), ενώ με το όρισμα START=" " μπορούμε να επιλλέξουμε την αρχική τιμή της λίστας. Τέλος, με το όρισμα VALUE=" " στον κωδικό <LI> μπορούμε να αντιστοιχίσουμε όποιον αριθμό θέλουμε (προσοχή, η τιμή του ορίσματος VALUE θα είναι πάντα 1 ή 2 ή 3,...., ανεξάρτητα από τον τύπο αρίθμησης που επιλέξαμε). Να λοιπόν ένα παράδειγμα:
Κώδικας Εμφάνιση
<OL type="i" start="2">
<LI>Σχετικιστική Κβαντομηχανική</LI>
<LI>Εξίσωση Klein-Gordonv</LI>
<LI>Εξίσωση Dirac</LI>
<LI value="6">Κβαντική Ηλεκτροδυναμική</LI>
<LI>Ανακανονικοποίηση</LI>
</OL>
  1. Σχετικιστική Κβαντομηχανική
  2. Εξίσωση Klein-Gordon
  3. Εξίσωση Dirac
  4. Κβαντική Ηλεκτροδυναμική
  5. Ανακανονικοποίηση

Μη διατεταγμένη λίστα
Οι κωδικοί για τη μη διατεταγμένη λίστα είναι οι <UL> και </UL>, στην αρχή και το τέλος της λίστας και οι <LI> </LI> στην αρχή και το τέλος κάθε στοιχείου της λίστας. Εξ ορισμού, εμφανίζεται μια μαύρη κουκίδα στην αριστερή πλευρά κάθε νέου στοιχείου. Με το όρισμα TYPE=" " στον κωδικό <UL> μπορείτε να επιλλέξετε μεταξύ CIRCLE (άσπρη λουκίδα), SQUARE (μαύρο τετραγωνάκι) και βέβαια DISC που αντοιστοιχεί στη μαύρη κουκίδα. Με αυτό τον τρόπο αλλάζετε για όλη τη λίστα το σύμβολο. Αν επιθυμείτε να έχετε διαφορετικά σύμβολα στην ίδια λίστα, το όρισμα TYPE=" " μπορεί να χρησιμοποιειθεί και στον κωδικό <LI>. Έτσι, το προηγούμενο παράδειγμα μπορεί να γραφτεί ως:
Κώδικας Εμφάνιση
<UL TYPE="CIRCLE">
<LI>Σχετικιστική Κβαντομηχανική</LI>
<LI>Εξίσωση Klein-Gordonv</LI>
<LI TYPE="SQUARE">Εξίσωση Dirac</LI>
<LI>Κβαντική Ηλεκτροδυναμική</LI>
<LI TYPE="DISC">Ανακανονικοποίηση</LI>
</UL>
  • Σχετικιστική Κβαντομηχανική
  • Εξίσωση Klein-Gordonv
  • Εξίσωση Dirac
  • Κβαντική Ηλεκτροδυναμική
  • Ανακανονικοποίηση

Για χρήση εικόνων ως συμβόλων στην λίστα, κάντε κλίκ εδώ

Μπορείτε να χρησιμοποιήσετε λίστα μέσα σε μια άλλη λίστα (ένθετη λίστα). Ο αναγνώστης ιστοσελίδων θα δώσει στην ένθετη λίστα μεγαλύτερο αριστερό περιθώριο για να ξεχωρίζει. Όλοι οι κανόνες για τις λίστες ισχύουν και για την ένθετη λίστα. Για παράδειγμα:
Κώδικας Εμφάνιση
<OL type="A">
<LI>Σχετικιστική Κβαντομηχανική
     <UL TYPE="CIRCLE">
     <LI>Έιδική Θεωρία Σχετικότητας</LI>
     <LI>Χρήσιμες Σχέσεις</LI>
     </UL>
</LI>
<LI>Εξίσωση Klein-Gordonv</LI>
<LI>Εξίσωση Dirac
     <UL TYPE="SQUARE">
     <LI>Οι Πίνακες γ</LI>
     <LI>Το αντι-ηλεκτρόνιο</LI>
     </UL>
</LI>
<LI>Κβαντική Ηλεκτροδυναμική</LI>
<LI>Ανακανονικοποίηση</LI>
</OL>
  1. Σχετικιστική Κβαντομηχανική
    • Έιδική Θεωρία Σχετικότητας
    • Χρήσιμες Σχέσεις
  2. Εξίσωση Klein-Gordonv
  3. Εξίσωση Dirac
    • Οι Πίνακες γ
    • Το αντι-ηλεκτρόνιο
  4. Κβαντική Ηλεκτροδυναμική
  5. Ανακανονικοποίηση

Λίστα ορισμών
Tέλος, με τη λίστα ορισμών μπορούμε να εμφανίζουμε ορισμένους όρους και τους αντίστοιχους ορισμούς τους. Ο κωδικός <DL> αρχίζει τη λίστα, ο <DΤ> αρχίζει τον όρο (και ο </DΤ> τον κλίνει) και ο <DD> αρχίζει τον ορισμό (και ο </DD> τον κλίνει), και βέβαια η λίστα κλίνει με τον </DL>. Ας κλείσουμε το κεφάλαιο αυτό με ένα σχετικό παράδειγμα:
<DL>
<DT><Ampere</DT>
<DT>(Αμπέρ)</DT>
<DD>Σύμβολο: <B>Α</B>. Μονάδα μέτρησης ηλεκτρικού ρεύματος. Ορίζεται ως το σταθερό ρεύμα που διαρρέει δύο παράλληλους αγωγούς απείρου μήκους, αμελητέας διατομής, σε απόσταση 1 μέτρου και προκαλεί δύναμη ίση με 2 10<sup>-7</sup> N/m. </DD>
<DT>Tesla</DT>
<DT>(Τέσλα)<DT>
<DD>Σύμβολο: <B>T</B>. Μονάδα μέτρησης πυκνότητας μαγνητικής ροής. Ορίζεται ως 1 Weber ανά τετραγωνικό μέτρο </DD>
</DL>

που θα δώσει:

Ampere
(Αμπέρ)
Σύμβολο: Α. Μονάδα μέτρησης ηλεκτρικού ρεύματος. Ορίζεται ως το σταθερό ρεύμα που διαρρέει δύο παράλληλους αγωγούς απείρου μήκους, αμελητέας διατομής, σε απόσταση 1m και προκαλεί δύναμη ίση με 2 10-7 N/m.
Tesla
(Τέσλα)
Σύμβολο: T. Μονάδα μέτρησης πυκνότητας μαγνητικής ροής. Ορίζεται ως 1 Weber ανά τετραγωνικό μέτρο (1W/m2)

Προσέξτε τη πολλαπλή χρήση του <DT>. Το ίδιο μπορεί να γίνει για πάνω από ένα ορισμό στον ίδιο όρο.


'Aσκηση 2: Πληκτρολογήστε τον κώδικα HTML ώστε να εμφανίζεται στον αναγνώστη ιστοσελίδων το παρακάτω κείμενο:


Εδώ μπορείτε να δείτε σε ξεχωριστό παράθυρο του αναγνώστη ιστοσελίδων το html αρχείο που παρήγαγε την παραπάνω εικόνα, οπότε να διαβάσετε και τον αντίστοιχο κώδικα.


Προηγούμενη ενότητα Επόμενη ενότητα