Ποια είναι η καλύτερη τεχνική (CSS)

[sarakinos]

Καλησπέρα...ξεκίνησα να φτιάχνω μια σελίδα αυτό τον καιρό..

Το θέμα μου είναι ότι θέλω να βάλω ένα μπαρμπαδέλι σαν αυτό του insomnia στο header το οποίο όμως στην ουσία θα κάθεται πάνω στην αρχή του content μου..ξέρω ότι κανένας δεν κατάλαβε μέχρι τώρα τι θέλω ...screenshot παρακάτω..

Ποιά είναι η καλύτερη,ή αν θέλετε η ποιο διαδεδομένη τεχνική για να γίνει αυτό..

Η σελίδα γενικά αποτελείται μέχρι τώρα από ένα wrapper που θα περιέχει μέσα τα πάντα,ενα header και ένα footer .Όλα αυτά σε divs...o κενός χώρος στο κέντρο θα χωριστεί με divs για το περιεχόμενο..

[orotoi]

να το έβαζες σαν background image στο div που έχει μέσα του το div του content..

[Haldol]

Προσωπικά θα έστελνα το wrapper από εκεί που ήρθε. Έπειτα θα έβαζα για background την εικόνα τόσο στο header όσο και στο αποκάτω div χρησιμοποιώντας sprites.

[digimyth]

sarakinos να σε ρωτήσω κάτι όχι πολύ σχετικό;

Εγώ θέλω να μάθω πως έκανες αυτό το ανθρωπάκι να κρέμονται τα πόδια του έξω από την εικόνα. Αυτό δεν έχω καταλάβει ακόμη. Εγώ ξέρω τις εικόνες σαν σχήματα με 4 γωνίες και δεν έχω ιδέα αν μπορείς να κάνεις δικό σου σχήμα εικόνας...

[TheELF]

Δεν κρέμονται έξω από την εικόνα,απλά βάζεις bakground-transparency στο μπάρμπα διαφορετικά χρώματα στο header και στο body και εφόσον τοποθετηθεί στο σωστό ύψος δημιουργείτε αυτή η ψευδαίσθηση.

[spartakoscs]

φτιάξε ένα div με z-index > από αυτού του header σου που θα περιέχει τον μπαρμπα μόνο !

[sarakinos]

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

[Haldol]

Την λύση με sprites που σου πρότεινα δεν τη σκέφτεσαι; Θα γλίτωνες αρκετό κώδικα έτσι.

[sarakinos]

Το έκανα με z-index και δούλεψε...δεν ξέρω αν αντιμετωπίσω κανένα πρόβλημα στην συνέχεια...μπορείς να μου εξηγήσεις λίγο τι παίζει με τα sprites?

[orotoi]

Με λίγα λόγια είναι να έχεις τα images που χρησιμοποιείς πιο συχνά (πχ διάφορα εικονίδια ή κάποιο menu κτλ) όλα σε ένα (νοικοκυρεμένα) αρχείο.

 

Με πολλά λόγια.. http://www.alistapart.com/articles/sprites

[Haldol]

Ακριβώς. Στην περίπτωση του topic starter όμως, προτείνω χρήση αυτής της τεχνικής ώστε να γλυτώσει από το επιπλέον div. Για απλούστερο και πιο ξεκάθαρο markup. Πρόκειται για μία εικόνα, οπότε κέρδος σε HTTP requests (άρα και στο χρόνο φόρτωσης της σελίδας) δεν θα έχουμε.

[orotoi]

E αφού θα μπει στη λογική αυτή ας το κάνει για ολα