Αν και η HyperText Markup Language( HTML) παρέχει μια ετικέτα που δημιουργεί ένα οριζόντιο διαιρέτη, δεν υπάρχει ένα ισοδύναμο στοιχείο που δημιουργεί μια κάθετη γραμμή.Απαιτείται συχνά μια κατακόρυφη μορφή, έτσι δημιουργείται ένα δίλημμα.Ευτυχώς, έχετε την επιλογή να χρησιμοποιήσετε έναν εναλλακτικό τρόπο αντιμετώπισης που ενσωματώνει έναν πίνακα HTML και εφαρμόζει έναν κώδικα στυλ Cascading Style( CSS) σε ένα περίγραμμα.Κατανοήστε τον τρόπο δημιουργίας του κώδικα HTML και εφαρμόστε τον κανόνα CSS που επιτυγχάνει με επιτυχία μια κάθετη και σταθερή γραμμή.

Οδηγίες

  1. Ξεκινήστε το λογισμικό επεξεργασίας κειμένου του Notepad, το οποίο συνοδεύει τον υπολογιστή σας των Windows και ανοίξτε ένα έγγραφο ιστότοπου.

  2. Τοποθετήστε τον κέρσορα στην επιθυμητή περιοχή όπου θέλετε να εμφανίζεται η συμπαγής γραμμή.Εισαγάγετε τον κώδικα HTML που δημιουργεί έναν απλό πίνακα:

    & lt; table & gt;

    & lt; tr & gt;

    & lt; / td & gt;

    & lt; / tr & gt;

    & lt; / table & gt;

  3. Πληκτρολογήστε τον ακόλουθο κώδικα πριν το κλείσιμο "& lt; / head & gt;"για να δημιουργήσετε τον κανόνα στυλ CSS για τον πίνακα:

    & lt; style type = "text / css" & gt;

    & lt;! -

    πίνακας{ }

    - & gt;

    & lt; / style & gt;

  4. Πληκτρολογήστε "border-left"; "ή "border-right:;"ανάμεσα στις σγουρές αγκύλες για να καθορίσετε εάν η γραμμή σας εμφανίζεται στα αριστερά ή δεξιά και εισαγάγετε "solid" μετά το παχύ έντερο για να καθορίσετε αυτό το πώς θα εμφανιστεί η γραμμή σας.Πληκτρολογήστε έναν αριθμό σε εικονοστοιχεία( px) για να καθορίσετε πόσο ευρεία είναι η κάθετη γραμμή και εισαγάγετε ένα χρώμα, όπως το μαύρο, για να καθορίσετε τη σκιά της γραμμής.Για να απεικονίσουμε: Πίνακας

    { border-left: 1px solid black;}

  5. Τύπος "ύψος:;"και πληκτρολογήστε μια τιμή αριθμού σε εικονοστοιχεία( px) ή ποσοστό( %) για να καθορίσετε τη διάρκεια της γραμμής.Για παράδειγμα: πίνακας

    { border-left: 1px solid black;ύψος: 300px;}

  6. Αποθηκεύστε το αρχείο σας.Ανοίξτε το σε ένα παράθυρο του προγράμματος περιήγησης κάνοντας κλικ στην επιλογή "Άνοιγμα" ή "Άνοιγμα αρχείου" στο μενού "Αρχείο" του προγράμματος περιήγησης.Εάν είστε ικανοποιημένοι με την κάθετη γραμμή, μεταφορτώστε το αρχείο στον οικοδεσπότη Ιστού σας για να το δημοσιεύσετε.Διαφορετικά, πραγματοποιήστε προσαρμογές στις τιμές του κανόνα στυλ πριν την αποθηκεύσετε και την ανεβάσετε στον κεντρικό σας υπολογιστή.Πόροι

  • Tizag: CSS Tutorial - Συνοριακό
  • Κοινοπραξία World Wide Web( W3C): Μοντέλο πλαισίου
  • Κοινοπραξία World Wide Web( W3C): Ξεκινώντας με το HTML + CSS