λογισμικό

* Γνώση Υπολογιστών >> λογισμικό >> Ανοικτού κώδικα

Πώς να δημιουργήσετε ένα πρότυπο με Divs

Δημιουργώντας ένα πρότυπο HTML σας βοηθά να οικοδομήσουμε γρήγορα μέλλον σελίδες του δικτυακού τόπου . Αντιγράψτε τον κωδικό του προτύπου και να το επικολλήσετε στο editor για να δημιουργήσετε μια νέα σελίδα . Χρήση divs σημαίνει ότι μπορείτε εύκολα να αλλάξετε τη διάταξη της ιστοσελίδας σας με την επεξεργασία ενός αρχείου : το αρχείο CSS , η οποία ελέγχει τη διάταξη των divs σε όλη την περιοχή . Τα πράγματα που θα χρειαστείτε
HTML /CSS editor της επιλογής σας
Η Εμφάνιση Περισσότερες οδηγίες
Η 1

Δημιουργήστε ένα αρχείο HTML σε ένα πρόγραμμα επεξεργασίας της επιλογής σας .

2

Τοποθετήστε τον ακόλουθο κώδικα HTML , ο οποίος δημιουργεί τη δομή της σελίδας σας και περιλαμβάνει μια σύνδεση με το αρχείο CSS . ( Το αρχείο CSS θα δημιουργηθεί σε μεταγενέστερο στάδιο . )



Layout 1






Προσθέστε έναν τίτλο της επιλογής σας για να αντικαταστήσετε το κείμενο " Layout 1 " .

Η 3

Προσθέστε τα ακόλουθα: « divs " μεταξύ των " " ετικέτες .




Περιεχόμενο



Αυτή είναι μια τυπική διάταξη για μια ιστοσελίδα . Η " Header " αναφέρεται στην αρχή της σελίδας ? Το μενού βρίσκεται από κάτω. Το κύριο περιεχόμενο της κάθε σελίδας πηγαίνει στο τμήμα "Περιεχόμενο" και η ενότητα " Υποσέλιδο " φιλοξενεί συνήθως το κάτω μέρος του μενού σε μια ιστοσελίδα . Κάθε τμήμα έχει ένα αναγνωριστικό που χρησιμοποιείται από το αρχείο CSS για να δηλώσει κάθε στοιχείο και τοποθετήστε το στο κατάλληλο τμήμα της σελίδας .
Η 4

Αποθηκεύστε τη σελίδα . ( Βεβαιωθείτε ότι έχει αποθηκευτεί ως αρχείο " . Html " . )
5

Δημιουργήστε ένα νέο " css . " Το αρχείο .
Η 6

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

* {

margin: 0 ?

padding : 0 ?

}

body {

υπόβαθρο : # eeeeee ?

font-family : sans -serif ?

font-size : 12px ?

}
Η 7

Προσθέστε το στυλ για το div header , η οποία θα καθορίσει το ύψος και το χρώμα :

div # header {

ύψος : 160px ?

υπόβαθρο: # 800000 ?

}
8

Ορίστε το στυλ για τις άλλες div στοιχεία της σελίδας : την " πλοήγηση " , το "περιεχόμενο" και το " footer " :

div # πλοήγησης {

φόντο : λευκό?

πλάτος: 25 % ?

float : αριστερά?

}

div # περιεχομένου {

περιθώριο : 0 25 % ?

υπόβαθρο : # BDBD00 ?

}

div # footer {

υπόβαθρο : # 800000 ?

πλάτος: 100 % ?

σαφής : αριστερά?

}
Η 9

Αποθηκεύστε το αρχείο ως " MyName.css " .
Η 10

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

Συναφής σύστασή

Πνευματικά δικαιώματα © Γνώση Υπολογιστών Όλα τα δικαιώματα κατοχυρωμένα