Λίστες & πίνακες


Εδώ θα δούμε πως μπορούμε να φτιάξουμε λίστες (τόσο με αρίθμηση όσο και με κουκίδες) και πίνακες.

  • Για να φτιάξουμε μια απλή λίστα με κουκίδες θα πρέπει όλη η λίστα να μπεί μέσα σε tags της μορφής <ul> </ul> και κάθε στοιχείο της λίστας να μπεί σε tags της μορφής <li> </li>

    <ul>
    <li>στοιχείο 1</li>
    <li>στοιχείο 2</li>
    <li>στοιχείο 3</li>
    </ul>

    Το αποτέλεσμα θα είναι:

  • Για να φτιάξουμε μια απλή λίστα με αρίθμηση θα πρέπει όλη η λίστα να μπεί μέσα σε tags της μορφής <ol> </ol> και κάθε στοιχείο της λίστας να μπεί σε tags της μορφής <li> </li>

    <ol>
    <li>στοιχείο 1</li>
    <li>στοιχείο 2</li>
    <li>στοιχείο 3</li>
    </ol>

    Το αποτέλεσμα θα είναι:
    1. στοιχείο 1
    2. στοιχείο 2
    3. στοιχείο 3

  • Για να δημιουργήσουμε ένα πίνακα χρειαζόμαστε τρία βασικά tags:

    Το tag που δημιουργεί τον πίνακα: <table> </table>
    Το tag που δημιουργεί τις γραμμές του πίνακα: <tr> </tr>
    Το tag που δημιουργεί τα κελία του πίνακα: <td> </td>

    Ένας πίνακας λοιπόν 2x3 φτιάχνεται έτσι:

    <table>
    <tr>
    <td> Α </td><td> Β </td><td> C </td>
    </tr>
    <tr>
    <td> D </td><td> E </td><td> F </td>
    </tr>
    </table>

    To αποτέλεσμα θα είναι:

    A B C
    D E F

    Για να βάλουμε περίγραμμα στον πίνακα μας αρκεί μέσα στο tag table να προσθέσουμε το border="1":

    <table border="1">

    Οπότε ο πίνακας θα γίνει:

    A B C
    D E F



    Τέλος!