2010-05-02 22 views
6

Quiero crear una página web con fondo transparente, una tabla y algo de texto. He visto publicaciones relacionadas con esto, pero debido a mi falta de familiaridad con CSS, de alguna manera no puedo hacer que mi código funcione. Solo quiero un fondo transparente, mientras que este código hace que todo sea transparente. ¿Alguien puede ayudar amablemente?html fondo transparente

<html> 
<head><style type="text/css"> 
    div.transbg {background-color:#4a6c9b; opacity:0.6;} 
</style></head> 
<div class="transbg"> 
<body><Center><font color="#FFFFFF"> 
    <b>Toll Charges</b> 
    <table bgcolor="#000000" cellspacing=3> 
    <tr> 
     <td bgcolor="#009900"><font color="#FFFFFF" align="left"> &nbsp; &nbsp;Class 2 inc Private&nbsp;</font></td> 
     <td bgcolor="#009900"><font color="#FFFFFF" align="right"> &nbsp;A$ 4.95 &nbsp;</font></td> 
    </tr> 
    <tr> 
     <td bgcolor="#009900"><font color="#FFFFFF" align="left"> &nbsp; &nbsp;Class 2 inc Commercial&nbsp;</font></td> 
     <td bgcolor="#009900"><font color="#FFFFFF" align="right"> &nbsp;A$ 13.95 &nbsp;</font></td> 
     </tr> 
    </table> 
    <br> 
    Toll has to be paid within 48 hrs of passage, else an additional A$ 13.95 of administration charges would be added 
    </font></Center> 
</div> 
</body> 
</html> 

actualización

Grandes gracias por todas las respuestas a la gente. He resuelto el problema de otra manera por el momento. De hecho, estoy escribiendo una aplicación para iPhone que usa Webview para mostrar algunos html. Quería darle a la vista web una apariencia transparente, que se puede lograr configurando el alfa para la propia vista web en el constructor de interfaz. Es como decir, hacer que todo mi navegador web sea 50% transparente. Me gustaría agradecer a todos por su ayuda aquí.

+3

PS : '' y '

' están en desuso desde 1998 (!!!).Por favor, eche el tutorial/libro de HTML vintage que está utilizando y obtenga uno reciente. – BalusC

+0

Sí, en estos días, el formateo debe hacerse en el CSS. Imagínelo como todos sus atributos, como '' y 'bgcolor', todo en una sola ubicación. De esta forma solo necesita usar el atributo de clase para determinar el estilo. –

Respuesta

0

No estoy seguro si su requisito tiene sentido. Solo dale al fondo el color deseado.

div.transbg { background-color: #92a7c3; } 

La transparencia solo es interesante para las imágenes de fondo o fondos superpuestos, lo que no parece ser aplicable en su caso particular.

3

Creo que usted está buscando esto,

.transbg { 
    background-color:#4a6c9b; 
filter:alpha(opacity=60); 
-moz-opacity:0.6; 
-khtml-opacity: 0.6; 
opacity: 0.6; 
} 

y tal vez esto http://css-tricks.com/rgba-browser-support/

+0

Su problema fue más bien que "todo" se vuelve transparente, no es que no funcione en IE <8 or the > motores de navegador Gecko/KDE de 2 años. – BalusC

+0

editado antes de tu comentario =) – user295292

+0

Recito: * "mientras que este código está haciendo que todo sea transparente" *. Por lo tanto, la transparencia funciona perfectamente. No es solo lo que esperaba. – BalusC

3

sugiere emplear RGBA en lugar de opacidad, de esta manera:

.transbg {background: rgba(red,green,blue,opacity);} 

También se puede poner el resto de su formateo en CSS como este:

body {background-color:#000; 
     color:#fff;} 
td {background-color: #090; 
    color:#fff;} 
.leftc {text-align:left;} 
.rightc {text-align:right;} 
table {borderspacing: 3;} 

Ahora puede eliminar las etiquetas de fuente y los atributos de td. Todo lo que necesitaría para td es <td class="leftc"> o con la clase rightc para texto a la derecha.

Ver también http://css-tricks.com/rgba-browser-support/

2

Recientemente he descubierto que quería crear un cuerpo HTML con un fondo transparente. (El HTML es una página de información localizada de instrucciones para una aplicación, y aparecerá como un "navegador" que en realidad es solo una vista de Webkit dentro de otro conjunto de vistas. La vista de Webkit se encuentra sobre una imagen en la jerarquía de vistas. el fondo de la página web transparente, la imagen de la vista detrás de la vista Webkit se muestra)

Para lograr esto, simplemente codificar el HTML de la siguiente manera, junto con cualesquiera otros atributos/estilos/etc:.

<body bgcolor=transparent> 

En otras palabras, use la palabra clave "transparente" sin las comillas, y obtendrá un alfa de 0 y, por lo tanto, un fondo transparente para permitir que todo lo que está detrás se muestre a través de .

(Advertencia:.. En la implementación vista Webkit que tengo, también tengo que hacer que el color de fondo Webkit transparente en mi configuración de la interfaz de usuario es decir, ambos deben estar en su lugar para que esto funcione como lo tengo)

+0

Excelente para mí. +1 –