Στην HTML, μπορείτε να χρησιμοποιήσετε τα εξής στοιχεία για την αναπαράσταση κώδικα υπολογιστή:
- Το στοιχείο
<code>: Χρησιμοποιείται για την αναπαράσταση ενός μικρού τμήματος κώδικα. Ο κώδικας που περικλείεται μέσα σε αυτό το στοιχείο εμφανίζεται με μονοτονική γραμματοσειρά.
Παράδειγμα:
<p>Μπορείτε να χρησιμοποιήσετε το στοιχείο <code><code></code> για να εμφανίσετε κώδικα HTML.</p>
- Το στοιχείο
<pre>: Χρησιμοποιείται για την αναπαράσταση μορφοποιημένου κώδικα υπολογιστή, που διατηρεί την αρχική του μορφή και διάταξη. Ο κώδικας που περικλείεται μέσα σε αυτό το στοιχείο εμφανίζεται με μονοτονική γραμματοσειρά και διατηρεί τους κενούς χώρους, τις αλλαγές γραμμής και τα κείμενα με πολλαπλά κενά.
Παράδειγμα:
<pre>
function sayHello() {
console.log("Hello, World!");
}
sayHello();
</pre>
Αυτά τα στοιχεία σας επιτρέπουν να παρουσιάζετε κώδικα υπολογιστή με κατάλληλη μορφοποίηση και αποτύπωση στις HTML σελίδες σας.
Το στοιχείο HTML <kbd> χρησιμοποιείται για να ορίσετε εισαγωγή από πληκτρολόγιο. Το περιεχόμενο μέσα σε αυτό το στοιχείο εμφανίζεται με την προεπιλεγμένη μονοτονική γραμματοσειρά του προγράμματος περιήγησης.
Παράδειγμα:
<p>Πατήστε το πλήκτρο <kbd>Enter</kbd> για να συνεχίσετε.</p>
Αυτό το παράδειγμα θα εμφανίσει το πλήκτρο “Enter” με μονοτονική γραμματοσειρά, ξεχωρίζοντάς το από τον υπόλοιπο κείμενο.
Μπορείτε να χρησιμοποιήσετε το στοιχείο <kbd> για να εμφανίσετε πλήκτρα πληκτρολογίου, συνδυασμούς πλήκτρων ή οτιδήποτε άλλο αφορά την εισαγωγή από πληκτρολόγιο στις HTML σελίδες σας.
Το στοιχείο HTML <samp> χρησιμοποιείται για να ορίσετε το δείγμα εξόδου από ένα πρόγραμμα υπολογιστή. Το περιεχόμενο μέσα σε αυτό το στοιχείο εμφανίζεται με την προεπιλεγμένη μονοτονική γραμματοσειρά του προγράμματος περιήγησης.
[adinserter block=”2″]
Παράδειγμα:
<p>Η έξοδος του προγράμματος είναι: <samp>Hello, World!</samp></p>
Σε αυτό το παράδειγμα, η φράση “Hello, World!” εμφανίζεται με μονοτονική γραμματοσειρά, υποδεικνύοντας ότι αυτό είναι το δείγμα εξόδου από ένα πρόγραμμα.
Μπορείτε να χρησιμοποιήσετε το στοιχείο <samp> για να εμφανίσετε δείγματα εξόδου προγραμμάτων ή οτιδήποτε άλλο αναφέρεται στην έξοδο από ένα πρόγραμμα υπολογιστή στις HTML σελίδες σας.
Το στοιχείο HTML <code> χρησιμοποιείται για να ορίσετε ένα τμήμα κώδικα υπολογιστή. Το περιεχόμενο μέσα σε αυτό το στοιχείο εμφανίζεται με την προεπιλεγμένη μονοτονική γραμματοσειρά του προγράμματος περιήγησης.
Παράδειγμα:
<p>Μπορείτε να χρησιμοποιήσετε το στοιχείο <code><code></code> για να εμφανίσετε κώδικα HTML.</p>
Σε αυτό το παράδειγμα, η φράση <code> εμφανίζεται με μονοτονική γραμματοσειρά, υποδεικνύοντας ότι αυτός είναι ένας κώδικας HTML.
Μπορείτε να χρησιμοποιήσετε το στοιχείο <code> για να περικλείσετε κώδικα υπολογιστή ή οτιδήποτε άλλο αναφέρεται σε κώδικα στις HTML σελίδες σας.
Το στοιχείο <code> δεν διατηρεί τους επιπλέον κενούς χώρους και τις αλλαγές γραμμής αυτόματα.
Για να διορθώσετε αυτό το πρόβλημα, μπορείτε να τοποθετήσετε το στοιχείο <code> μέσα στο στοιχείο <pre>. Το στοιχείο <pre> χρησιμοποιείται για τη διατήρηση της αρχικής μορφής και διάταξης του κειμένου, συμπεριλαμβανομένων των επιπλέον κενών χώρων και των αλλαγών γραμμής.
Παράδειγμα:
<pre><code>
function sayHello() {
console.log("Hello, World!");
}
sayHello();
</code></pre>
Με αυτόν τον τρόπο, ο κώδικας θα διατηρήσει τους επιπλέον κενούς χώρους και τις αλλαγές γραμμής όπως τον πληκτρολογήσατε.
Αυτή η συνδυαστική χρήση των στοιχείων <code> και <pre> σας επιτρέπει να διατηρήσετε την ακριβή μορφή του κώδικα υπολογιστή στις HTML σελίδες σας.
Το στοιχείο HTML <var> χρησιμοποιείται για να ορίσει μια μεταβλητή στον προγραμματισμό ή σε μαθηματική έκφραση. Το περιεχόμενο μέσα σε αυτό το στοιχείο συνήθως εμφανίζεται με πλάγια γραφή (italic).
Παράδειγμα:
<p>Θεωρήστε το <var>x</var> το πλάτος του ορθογωνίου.</p>
Σε αυτό το παράδειγμα, η μεταβλητή “x” εμφανίζεται με πλάγια γραφή για να υποδείξει ότι πρόκειται για μια μεταβλητή.
Μπορείτε να χρησιμοποιήσετε το στοιχείο <var> για να περιβάλλετε μια μεταβλητή ή οτιδήποτε άλλο αναφέρεται σε μια μεταβλητή στις HTML σελίδες σας.