Conhecimento relacionado sobre transparência CSS Alpha. Por favor, dê uma olhada no seguinte código primeiro:
Código do programa
filtro:alfa(opacidade=50); /* IE */
-moz-opacidade:0,5; /* Moz + FF */
Opacidade: 0,5; /* Navegadores que suportam CSS3 (FF 1.5 também suporta) */
Para explicar brevemente, o IE usa o atributo privado filter:alpha(opacity), o Moz Family usa o atributo privado -moz-opacity e o atributo padrão é opacity (CSS 3, Moz Family suporta parcialmente CSS3). O valor a seguir é transparência, use porcentagem ou decimal (alfa (opacidade)). Use um valor maior que 0 e menor que 100, que na verdade é uma porcentagem). Você não vê o Opera no código acima. É isso mesmo, o Opera ainda não oferece suporte à opacidade padrão, nem possui propriedades privadas próprias para oferecer suporte à transparência Alpha. No entanto, sabemos que o Opera suporta imagens PNG transparentes Alpha (é claro que o Moz Family também suporta). Portanto, podemos usar uma imagem de fundo para obter transparência Alpha.
A chave é:
código do programa
background:url transparente(alpha80.png) repetição superior esquerda!importante;
plano de fundo:#ccc;
filtro:alfa(opacidade=50);
Como o Moz Family suporta PNGs alfa-transparentes, não precisamos usar suas propriedades privadas. Claro, você pode usar a opacidade padrão, mas não use imagens transparentes alfa e opacidade ao mesmo tempo, caso contrário, ela se tornará uma mistura das duas. Você pode baixar o exemplo acima e dar uma olhada nos comentários de /*opacity:.5;*/.