gracias, mira ya logre todo ahora lo unico que me pasa es que no me sale el
opacity en IE! ayudita

<head>
<link rel="stylesheet" type="text/css" href="styleiframe.css">
</head>


<body id="contenido">

<div id="container3">
    <div id="container2">
        <div id="container1">
            <div id="col1">
                <!-- Column one start -->
                <h2>Nosotros</h2>

                <p>JavaScript is not required. Some website layouts rely on
JavaScript hacks to resize divs and force elements into place but you won't
see any of that nonsense here.</p>
                <!-- Column one end -->

            </div>
            <div id="col2">
                <!-- Column two start -->
                <h2>No Images</h2>
                <p>This three column layout requires no images. Many CSS
website designs need images to colour in the column backgrounds but that is
not necessary with this design. Why waste bandwidth and precious HTTP
requests when you can do everything in pure CSS and HTML?</p>
                <h2>Valid XHTML strict markup</h2>
                <p>The HTML in this layout validates as XHTML 1.0
strict.</p>

                <h2>This layout is FREE for anyone to use</h2>
                <p>You don't have to pay anything. Simply view the source of
this page and save the HTML onto your computer. My only suggestion is to put
the CSS into a separate file. If you are feeling generous however, link back
to this page so other people can find and use this layout too.</p>
                <!-- Column two end -->
            </div>
            <div id="col3">
                <!-- Column three start -->
                <h2>Cross-Browser Compatible</h2>
                <img src="images/uvas.jpg" alt"Fotografias"/>
                <h3>iPhone &amp; iPod Touch</h3>
                <ul>
                    <li>Safari</li>
                </ul>
                <h3>Mac</h3>

                <ul>
                    <li>Safari</li>
                    <li>Firefox</li>
                    <li>Opera 9</li>
                    <li>Netscape 7 &amp; 9</li>
                </ul>

                <h3>Windows</h3>
                <ul>
                    <li>Firefox 1.5, 2 &amp; 3</li>
                    <li>Safari</li>
                    <li>Opera 8 &amp; 9</li>

                    <li>Explorer 5.5, 6 &amp; 7</li>
                    <li>Google Chrome</li>
                    <li>Netscape 8</li>
                </ul>
                <!-- Column three end -->
            </div>

        </div>
    </div>
<div name="bg_name" class="box_background" style="height: 100%; width:
100%;"style="filter:alpha(opacity=50); z-index:-200;> </div>
</div>

<script src="http://www.google-analytics.com/urchin.js";
type="text/javascript">
</script>

<script type="text/javascript">
_uacct = "UA-1848067-8";
urchinTracker();
</script>

</body>


#contenido {
    margin:0;
    padding:0;
    color:white;

}

.box_background {
background-color:#000;
height:100%;
left:0;

    filter:alpha(opacity=50);
    -moz-opacity:0.5;
    -khtml-opacity: 0.5;
    opacity: 0.5;

position:absolute;
top:0;
width:100%;
z-index:-99;
}


/* Start of Column CSS */
#container3 {
    clear:left;
    float:left;
    width:100%;
    overflow:hidden;
    background: transparent;
     /* column 3 background colour */
}
#container2 {
    clear:left;
    float:left;
    width:100%;
    position:relative;
    right:33.333%;
    background:; /* column 2 background colour */
}
#container1 {
    float:left;
    width:100%;
    position:relative;
    right:33.33%;
    background:#; /* column 1 background colour */
}
#col1 {
    float:left;
    width:29.33%;
    position:relative;
    left:68.67%;
    overflow:hidden;

}
#col2 {
    float:left;
    width:29.33%;
    position:relative;
    left:72.67%;
    overflow:hidden;

}
#col3 {
    float:left;
    width:29.33%;
    position:relative;
    left:76.67%;
    overflow:hidden;
}
#col3 > img {
z-index:101;
opacity:1;
}

/* --> */




2009/2/12 dreagnout <dreagn...@yahoo.es>

> Mira aquí:
>
> http://www.cssblog.es/tipos-de-transparencia-en-css/
>
> Un saludo.
> _______________________________________________
> Lista de distribución Ovillo
> Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
> Puedes modificar tus datos o desuscribirte en la siguiente dirección:
> http://lists.ovillo.org/mailman/listinfo/ovillo
>
_______________________________________________
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección: 
http://lists.ovillo.org/mailman/listinfo/ovillo

Responder a