Όταν δημιουργείτε τον δικό σας ιστότοπο, φυσικά θέλετε να εμφανίζεται όσο το δυνατόν πιο ελκυστική, ανεξάρτητα από την έκδοση του προγράμματος περιήγησης του χρήστη. Συγκεκριμένα, έτσι ώστε η εικόνα φόντου να τεντώνεται και να προσαρμόζεται στην ανάλυση της οθόνης του υπολογιστή.
Είναι απαραίτητο
δεξιότητες στην εργασία με html, css, java-script
Οδηγίες
Βήμα 1
Ανοίξτε τον κωδικό για τον ιστότοπό σας σε οποιοδήποτε πρόγραμμα επεξεργασίας, όπως το Σημειωματάριο ή ένα ειδικό πρόγραμμα σχεδιασμού ιστοσελίδων, το Dreamweaver. Επικολλήστε τις ακόλουθες γραμμές στον κώδικα για να τεντώσετε το φόντο του ιστότοπου. Προσθήκη φόντου: url («Εισαγωγή συνδέσμου στην εικόνα»).
Βήμα 2
Για να ορίσετε την εικόνα οριζόντια, χρησιμοποιήστε τον ακόλουθο κώδικα: Φόντο: url («Εισαγωγή συνδέσμου στην εικόνα» επανάληψη-x), κάθετα - στο τέλος του κώδικα, αντικαταστήστε το x με y. Εάν ο ιστότοπος έχει στυλ σε αρχείο css, επικολλήστε τον κώδικα σε αυτόν. Με αυτόν τον τρόπο θα μπορείτε να βάλετε ένα ελαστικό υπόβαθρο στον ιστότοπό σας.
Βήμα 3
Χρησιμοποιήστε το ακόλουθο παράδειγμα κώδικα για να τοποθετήσετε μια εικόνα φόντου σε μια σελίδα και να την τεντώσετε αυτόματα ώστε να ταιριάζει με την ανάλυση της οθόνης στην οποία προβάλλεται η σελίδα. Παράδειγμα κωδικού: body {background: "Εισαγωγή συνδέσμου στην εικόνα φόντου" () σταθερό αριστερό κέντρο χωρίς επανάληψη. μετά το μέγεθος φόντου: […].
Βήμα 4
Για να τεντώσετε την εικόνα φόντου, απλώς εισαγάγετε μια εικόνα ως φόντο και ορίστε το πλάτος της στο 100%. Για παράδειγμα, εισαγάγετε το ακόλουθο κείμενο στον κώδικα της σελίδας: εικόνα φόντου "alt =" Εισαγάγετε το όνομα της εικόνας "/>. Έτσι, θα χρησιμοποιηθεί για να ταιριάζει στο πλάτος της εικόνας, αλλά οι αναλογίες της θα παραβιαστούν.
Βήμα 5
Ομοίως, μπορείτε να ρυθμίσετε την εικόνα να τεντώνεται σε ύψος, να χρησιμοποιείτε ύψος αντί για το χαρακτηριστικό πλάτος. Ή χρησιμοποιήστε το ακόλουθο παράδειγμα κώδικα για css: εικόνα φόντου του ιστότοπου) "> και αφού προσθέσετε 100% πλάτος της εικόνας όπως στο προηγούμενο παράδειγμα. Επίσης, μπορείτε να χρησιμοποιήσετε το σενάριο για να μάθετε την ανάλυση οθόνης του χρήστη και να επεξεργαστείτε το μέγεθος του τραπεζιού σας για αυτό.
