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

Πίνακας περιεχομένων:

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

Βίντεο: Πώς να δημιουργήσετε μια εικόνα φόντου σε έναν ιστότοπο

Βίντεο: Πώς να δημιουργήσετε μια εικόνα φόντου σε έναν ιστότοπο
Βίντεο: Change Photo Background Greek Πώς να αλλάξεις το φόντο σε μια φωτογραφία 2024, Απρίλιος
Anonim

Μπορείτε να μάθετε μόνοι σας τα βασικά της δημιουργίας ιστότοπων · υπάρχουν αρκετές πληροφορίες σχετικά με αυτό το θέμα στο Διαδίκτυο και στα βιβλία. Ωστόσο, στο αρχικό στάδιο, δυσκολίες προκύπτουν συχνά κατά τη χρήση μιας ή άλλης ετικέτας. Πράγματι, τα πιο συνηθισμένα στοιχεία θυμούνται καλύτερα, καθώς είναι απαραίτητα κατά τη σύνταξη οποιασδήποτε ιστοσελίδας.

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

Οδηγίες

Βήμα 1

Επιλέξτε την εικόνα που θέλετε να χρησιμοποιήσετε ως εικόνα φόντου. Εάν σκοπεύετε να εισαγάγετε κείμενο πάνω από την εικόνα, τότε σε αυτήν την περίπτωση συνιστάται να περιορίσετε τον εαυτό σας σε επιλογές χωρίς υπερβολική διαφοροποίηση, στις οποίες χρησιμοποιούνται πολλά χρώματα που είναι κοντά. Κατ 'αρχήν, για την εξάλειψη των κυματισμών, μπορείτε να δημιουργήσετε ένα "υπόβαθρο" για το περιεχόμενο - και το πρόβλημα θα επιλυθεί με επιτυχία.

Βήμα 2

Διορθώστε την εικόνα χρησιμοποιώντας το Adobe Photoshop. Όταν τελειώσετε, επιλέξτε την εντολή Save For Web από το μενού File και επιλέξτε το φάκελο που θέλετε. Εάν αυτή είναι η πρώτη εικόνα που χρησιμοποιείται για τον ιστότοπο, τότε δημιουργείται αυτόματα ένας φάκελος "Εικόνες".

Βήμα 3

Στην ετικέτα, γράψτε το χαρακτηριστικό background = "path to image". Παράδειγμα καταγραφής: ή. Ταυτόχρονα, λάβετε υπόψη ότι η ετικέτα θα πρέπει να εμφανίζεται μόνο μία φορά στον κώδικα, δεν πρέπει να πολλαπλασιάζεται.

Βήμα 4

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

• χρησιμοποιώντας το πρόγραμμα Adobe Photoshop, ορίστε τις απαιτούμενες παραμέτρους εικόνας σε pixel ("Image" - "Image size").

• ορίστε τις απαιτούμενες διαστάσεις στον κώδικα html.

Για παράδειγμα, εάν το πλάτος είναι 1250 px και το ύψος είναι 650 px, τότε πρέπει να προσθέσετε τα απαραίτητα χαρακτηριστικά για το κελί του πίνακα στο οποίο θα τοποθετηθεί η εικόνα.

Δεν μπορείτε να ορίσετε το μέγεθος στην ετικέτα - η εικόνα θα εμφανίζεται πάντα σε πλήρες μέγεθος.

Βήμα 5

Αναλογικό ccs για εισαγωγή εικόνας φόντου:

εικόνα φόντου

ΣΩΜΑ {

background-image: url (εικόνες / bg.jpg);

}

Το χαρακτηριστικό "background-image: url (images / bg.jpg)" είναι η διαδρομή προς την εικόνα φόντου.

Συνιστάται: