Mulig å gjøre tabeller transparente i CSS?

[Keiseren av Grønland]

Er det støtte for transparens i CSS nå?

 

Jeg kunne tenke meg å gjort bakgrunnsfargen på noen ruter halveis gjennomsiktige, altså 50% transparente. Er dette mulig med kode, eller må det bilder til?

[Kaptein Snus]

#div-med-opacity {
filter: alpha(opacity=50);
-moz-opacity: 0.5;
-khtml-opacity: 0.5;
opacity: 0.5;
}

 

Dette burde dekke de aller fleste browsere Det er opacity som er standarden nå for tiden

[Keiseren av Grønland]

moz er for mozilla?

De andre er for... hvilke lesere?

 

Alt dette er webkit ikke sant? Det er ikke nåværende CSS?

 

Har webkit-hjørner på forumet som stort sett bare er synlige i mozilla, og litt i safari. Det er slitsomt å bruke slike koder. Er det ingen av dem som gjelder for alle ?

[Hyacinth]

Det står litt mer forklart på W3Schools.

[Keiseren av Grønland]

Det står litt mer forklart på W3Schools.

Ikke veldig mye mer forklart:

  /* for IE */
 filter:alpha(opacity=60);
 /* CSS3 standard */
 opacity:0.6;
 }

 

CSS3 er jo ikke aktivt enda? Noen har indikert til meg at dette kan ta ti år.

 

Da blir de andre kodene lokale for hver enkelt nettleser, går jeg ut i fra? Og da spør jeg igjen hvilke nettleser de forskjellige kodene gjaldt.

[Vibeke S]

Husk at når du bruker opacity gjelder det alt inni elementet, også tekst og bilder.

 

-moz- er for Mozilla/Firefox

-webkit- er for Safari og Chrome

-khtml- er for Konqueror

 

Hvis du bare vil at bakgrunnen skal være gjennomsiktig vil jeg anbefale deg å bruke

background: rgba(0, 0, 0, 0.5);

...som i dette tilfellet gir en 50% dekkende svart bakgrunn.

 

Dette støttes (selvsagt) ikke av IE, men der kan du jo bruke et png-bilde (og tilhørende javascript-hack for ie6 hvis du må støtte den nettleseren).

Endret 10. februar 2010 av Vibeke Stølan

[Kaptein Snus]

Du kan jo ta en titt på denne siden for å se om du blir noe klokere bulletproof-cross-browser-rgba-backgrounds

[Keiseren av Grønland]

Jeg skal egentlig ha dette på en hvit bakgrunn til poster på et forum. Kan ikke se at teksten skulle bli gjennomsiktig da, denne har en egen klasse.

 

Hvis et bilde kommer bak dise postene, vil jeg at det skal kunne skimtes gjennom, bare ikke helt.

[Keiseren av Grønland]

  opacity:0.6;

 

Hva fungerer denne for da?

Er det noen av kodene her som er universelle?

[Kaptein Snus]

opacity er den nye standarden i CSS3 og vil fungere i alle browsere som støtter CSS3.

 

Når du bruker opacity, så vil alle child-elementene også blir transparent, og omvendt hvis du bruker opacity på en link i en div, så vil diven også bli transparent

[Keiseren av Grønland]

Men hvilke nettlesere er det som støtter CSS3 da? Etter min forståelse er det ingen?

 

Med webkit-koder er det greit, men det er jo bare en forsmak ikke sant? Men ekte og ren CSS3?

[PHPdude]

Hvem som evt. "støtter CSS3" er et irrelevant spørsmål i denne sammenheng. "CSS3" er et digert standardiserings-prosjekt bestående av mange forskjellige moduler som utvikles hver for seg.

 

Det eneste du trenger å bry deg om er om opacity gir deg den funksjonaliteten du trenger.

Helt unødvendig av Lek1 å dra vendor-prefixer (-moz- og -wekbit-) inn i bildet for "opacity" er støttet av alle de moderne nettleserne.

 

Og nei, jeg regner ikke IE som en moderne nettleser, men der har du nok en grei workaround med IEs proprietære "filter", som Lek1 alt har vist deg.