Como aplicar opacidade / transparência na css3

A opacidade ou transparência é um novo efeito no CSS3. Designers são realmente nos estágios iniciais de experimentar com esse efeito. Em CSS3, a transparência é definida através da atribuição de um valor para a propriedade de opacidade.

Um objeto totalmente opaco obscurece completamente o que está atrás de objetos IT- que não são totalmente opaco são parcialmente transparente, ou transparente.

Definindo fundos semitransparentes para elementos de layout de página com CSS3 apresenta algumas opções interessantes para web designers. fundos semitransparentes são muitas vezes utilizados, por exemplo, em listas drop-down. Lá, os elementos do menu drop-down tem 0,5 opacidade atribuída (eles são 50 por cento transparente). Como resultado, o conteúdo da página subjacente permanece visível quando um menu cai para baixo.

Video: TRANSPARÊNCIA COM ILLUSTRATOR CS6 - ROYALLOGIC

A propriedade de opacidade é definida com um valor que varia de 0 (Completamente invisível) para 1 (totalmente opaco- não é transparente em tudo). Assim, por exemplo, um valor de opacidade de 0,8 torna um objeto de 80 por cento opaco, e assim por diante.

A propriedade de opacidade não requer prefixos para diferentes navegadores. A sintaxe é simples:

opacidade: .x

A drop-down list mostrado, por exemplo, é definido como tal:

Video: Trucos CSS (28) - Background-image transparente

.menu_box {background-color: # 999-padding: 2px; color: # 333333 opacidade: .5-}