background εικόνα στο 100%

03 Φεβ
2011
από τον/την Praxitelis Ikonomidisκατηγορία: Χρήσιμα Άρθρα
Πολλές φορές θέλουμε στην σελίδα μας να τοποθετήσουμε στο παρασκήνιο μία εικόνα (background) αλλά να πιάνει το 100% του ύψους και του πλάτους, ανεξάρτητα από την ανάλυση του χρήστη. Να κάνει δηλαδή stretch η εικόνα.
Αντιμετώπισα πρόσφατα ένα τέτοιο θέμα και το έλυσα ως εξής:
Φτιάχνουμε ένα div πριν το page-wrap. Μέσα σε αυτό θα συμπεριλάβουμε την εικόνα μας.

Κώδικας:
<div id="bg-wrap"><img src="path/eikona.jpg" /></div>

και γράφουμε στο css:

Κώδικας:
#bg-wrap{
   position:fixed;
   top:0px;
   margin:0 auto;
   height:100%;
   width:100%;
   z-index:-2;
}
#bg-wrap img{
   height:100%;
   width:100%;
}
Ετικέτες:
Praxitelis Ikonomidis

Σχετικά με τον συντάκτη

Praxitelis Ikonomidis

Προγραμματιστής και επιχειρησιακός σύμβουλος για θέματα πληροφορικής. 22 χρόνια εμπειρίας σε τεχνολογίες σχεδίασης ιστοσελίδων και κατασκευής e-shop. Ο ιδανικός συνεργάτης σας σε θέματα Internet - web!

Κατασκευή Ιστοσελίδων

Η εταιρεία μας εξειδικεύεται στην κατασκευή ιστοσελίδων και eShop. Εξυπηρετούμε την ευρύτερη περιοχή της Θέρμης στη Θεσσαλονίκη αλλά και πελάτες μας σε ολόκληρη την Ελλάδα. Όλες οι ιστοσελίδες μας είναι responsive, ακολουθώντας τις πιο σύγχρονες τεχνικές σχεδίασης.

I-xperts and Creative
Αλίκη Βουγιουκλάκη, Θέρμη 57001, Θεσσαλονίκη
2310 32 71 91
Γ.Ε.ΜΗ: 037670605000

 Greek Site English Site

Copyright 2022-2023 ©I-xperts and Creative