Υποενότητα 3.3: Εμφάνιση περιεχομένου - Media - Ειδοποιήσεις
Υποενότητα 3.3: Εμφάνιση περιεχομένου - Media - Ειδοποιήσεις
- HTML πίνακες - Tables
- Κάρτες - Cards
- Εικόνες - Images
- Media Object
- Ειδοποιήσεις - Alerting Users
HTML Πίνακες - Tables
Prerequisites for this page: Tables-HTML, Tables-CSS
Σε αυτήν την υποενότητα, θα εξετάσουμε τους HTML Πίνακες - Tables και τις κλάσεις Bootstrap για τη μορφοποίηση πινάκων. Θα τροποποιήσουμε τη σελίδα aboutus.html για να προσθέσουμε έναν πίνακα.
Ας ξεκινήσουμε ανοίγοντας τη σελίδα aboutus.html
στον επεξεργαστή κώδικα. Θα προσθέσουμε μια νέα σειρά - row περιεχομένου μετά τη σειρά Corporate Leadership στη σελίδα. Αρχικά ξεκινάμε προσθέτοντας μια σειρά και στήλες στη σελίδα ως εξής:
Μέσα στην πρώτη στήλη αυτής της σειράς, εισάγετε τον πίνακα ως εξής:
Σημειώστε τη χρήση της κλάσης table-responsive
για να δημιουργήσετε έναν responsive πίνακα, καθώς και τις κλάσεις table-hover
και thead-dark
για τη μορφοποίηση του πίνακα
Για να αλλάξετε τα προεπιλεγμένα χρώματα για το dark και το hover table προσθέστε αυτόν τον κώδικα στο αρχείο mystyle.css file: