opacity...???

[quito]

καλησπερα παιδια, θα ηθελα αν γνωριζει καποιος να μου εξηγησει πως μπορω να φτιαξω το κυριως περιεχομενο μιας σελίδας να ειναι διαφανο σε σχεση με το background. όπως εδώ http://www.pilot-beach.gr/hotel-reservation.php

[Seldimi]

Είναι φτιαγμένο σε flash οπότε υπάρχει επιλογή transparency για κάθε αντικείμενο... δεν είναι απλή html

[PCharon]

... δεν είναι απλή html

...κι όμως γίνεται άνετα με απλό CSS.

 

http://www.w3schools.com/Css/css_image_transparency.asp

 

[edit] σωστή η παρατήρηση του από κάτω μου

[mpiftex]

Μπορείς να το κάνεις με τη χρήση ενός transparent .png ως background του κάθε div. Δουλεύει σε FF και ΙΕ7+. Για να φαίνεται σωστά και σε IE6 θέλει κόλπο ή javascript.

 

---------- Το μήνυμα προστέθηκε στις 19:57 ----------

 

...κι όμως γίνεται άνετα με απλό CSS.

 

http://www.w3schools.com/Css/css_image_transparency.asp

 

Σωστό κι αυτό αλλά δεν γίνεται validate.

To

>filter:alpha(opacity=60)

είναι για τον ΙΕ και φυσικά δεν είναι "σωστό", ενώ το

>opacity:0.6;

γίνεται δεκτό σε CSS3.

 

Πάντως δουλεύει μια χαρά αν δεν σε νοιάζει το validation.

[quito]

mpiftex

τι εννοεις Μπορείς να το κάνεις με τη χρήση ενός transparent .png

μπορεις να γινεις λιγο πιο κατανοητος?

[ΠάρηςΓ]

Εννοεί οτι μπορεις να βαλεις ως background στο μενου σου μια εικόνα png που εχει καποιο transparency . Βεβαια αυτο δεν παιζει σε παλαιους Browsers.Κα΄λύτερα δοκιμασε το opacity αλλα θελει λιγο ρυθμιση για να παιζει σε ολους τους Browser

 

---------- Το μήνυμα προστέθηκε στις 05:09 ----------

 

btw ωραιο το site λιγο το χρωμα τον textbox με χαλάει μονο

[mpiftex]

Σαν background στη σελίδα σου (στο body) βάλε κανονικά την εικόνα που θες για background. Στη συνέχεια φτιάξε στο photoshop μια εικόνα μεγέθους 100χ100pixels, βάψε την μαύρη και βάλε το opacity στο 60%. Έτσι θα γίνει ημιδιαφανής. Σώσε την ως .png (πχ bg.png). Tώρα το bg.png βάλε το σαν background σε όλα div (κουτιά) θες να έχουν αυτή τη διαφάνεια. Παίξε με το χρώμα της εικόνας (αντί για μαύρο) και με το ποσοστό του opacity για να πάρεις το αποτέλεσμα που θες και ώστε να είναι ευανάγνωστα τα γράμματα από πάνω. Σε IE6 και κάτω δεν θα φαίνεται σαν διαφάνεια γιατί δεν υποστηρίζουν transparency σε εικόνες. Εκεί θες κάποιο javascript για να φαίνεται η διαφάνεια.

[Uberalles_gr]

καλησπερα παιδια, θα ηθελα αν γνωριζει καποιος να μου εξηγησει πως μπορω να φτιαξω το κυριως περιεχομενο μιας σελίδας να ειναι διαφανο σε σχεση με το background. όπως εδώ http://www.pilot-beach.gr/hotel-reservation.php

Κάτι άσχετο με το topic αλλά μιας και βρήκα αφορμή από το site που μας έδειξε ο φίλος, πως γίνεται και καρφώνεται το background και δεν scrollarei?

[pOLoS]

Κάτι άσχετο με το topic αλλά μιας και βρήκα αφορμή από το site που μας έδειξε ο φίλος, πως γίνεται και καρφώνεται το background και δεν scrollarei?

 

είναι fixed

[PCharon]

πως γίνεται και καρφώνεται το background και δεν scrollarei?

body{background:url(image.jpg) fixed;}

[ΠάρηςΓ]

Aπλα τα fixed πρεπει να ειναι σωστά φτιαγμένα αλλιως θα φαινεται πολυ ασχημο σε διαφορετικες αναλύσεις

[Uberalles_gr]

Ευχαριστώ για την απάντηση

[VitamineQ]

υπάρχει και ο εύκολος τρόπος για διαφάνεια. με gif. και δε θέλει ούτε js hacks ούτε css...

 

ανοίγουμε photoshop νέο αρχείο, νέο layer, βάζουμε το χρώμα που θέλουμε, κατεβάζουμε τη διαφάνεια, πετάμε το layer του φόντου και save for web as gif

[th_m_s]

Όταν έφτιαχνα μία εργασία για την html είχα βρει κάπου στο ίντερνετ αυτό:

>style="background-color: black;filter:alpha(opacity=75); -moz-opacity:0.75; opacity: 0.75;border: 1px solid black;"

Απλά το βάζεις μέσα σε κάποιο tag.