Skip to main content

Πώς να εμφανίσετε XML σε μια ιστοσελίδα χρησιμοποιώντας το CSS

eBanking webpage using PHP, HTML, Javascript, CSS, XML & XSLPresentation (Μαρτιου 2024)

eBanking webpage using PHP, HTML, Javascript, CSS, XML & XSLPresentation (Μαρτιου 2024)
Anonim

Αν είστε εξοικειωμένοι με τον τρόπο με τον οποίο οι σελίδες HTML στυλ CSS, θα εκτιμήσετε την έννοια της μορφοποίησης. Κατά την έναρξη της γλώσσας σήμανσης XML, η εμφάνιση των δεδομένων ήταν λίγο περίπλοκη, αλλά αυτό άλλαξε με φύλλα στυλ.

Με την προσθήκη μιας αναφοράς στυλ φύλλου, μπορείτε να διαμορφώσετε και να προβάλετε τον κώδικα XML ως ιστοσελίδα. Χωρίς CSS ή κάποια άλλη μορφοποίηση, η XML εμφανίζεται ως βασικό κείμενο με ένα σφάλμα που δηλώνει ότι το πρόγραμμα περιήγησης δεν μπόρεσε να βρει ένα έγγραφο μορφοποίησης.

Παράδειγμα στυλ XML

Ένα απλό φύλλο στυλ απαιτεί μόνο να ορίσετε το στοιχείο και τα χαρακτηριστικά μορφοποίησης που είναι απαραίτητα για την εμφάνιση των δεδομένων.

Αυτό το κομμάτι κώδικα λέει στον επεξεργαστή ποια στοιχεία πρέπει να εμφανίζονται και πώς πρέπει να δουν στην ιστοσελίδα, όπως αυτό:

Η πρώτη γραμμή του αρχείου μορφοποίησης είναι το στοιχείο ρίζας. Τα χαρακτηριστικά για τη ρίζα ισχύουν για ολόκληρη τη σελίδα, αλλά τα αλλάζετε για κάθε ετικέτα. Αυτό σημαίνει ότι μπορείτε να ορίσετε το χρώμα φόντου για τη σελίδα και στη συνέχεια για κάθε τμήμα.

Αποθηκεύστε αυτό το αρχείο στον ίδιο κατάλογο με το αρχείο XML και βεβαιωθείτε ότι έχει την επέκταση αρχείου .CSS.

Σύνδεση με το CSS Από τη XML

Σε αυτό το σημείο, πρόκειται για δύο εντελώς ξεχωριστά έγγραφα. Ο επεξεργαστής δεν έχει ιδέα ότι θέλετε να συνεργαστούν για να δημιουργήσουν μια ιστοσελίδα.

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

Σε αυτό το παράδειγμα, καλείται το αρχείο CSS products.css , γι 'αυτό είναι χαρακτηρισμένο ως τέτοιο στο έγγραφο XML. Αλλάξτε αυτό σε οποιοδήποτε όνομα αρχείου έχετε επιλέξει για το αρχείο CSS.