Wedmasterayuda - Foro

Inteligencia Multiple WMA


    Transparencia con tablas , mousever y imagenes css

    Comparte
    avatar
    wario**

    Cantidad de envíos : 6
    Puntos : 6
    Reputación : 0
    Fecha de inscripción : 22/03/2009

    Transparencia con tablas , mousever y imagenes css

    Mensaje  wario** el Dom Mar 22, 2009 8:22 pm

    Hola , aqui traigo algunas pistas css

    Quizas algunos sepan pero de todas formas creo que sirve :


    Tabla transparente :

    Para el efecto :

    Código:

      <style type="text/css">
      div.background
        {
    width: 500px;
     height: 250px;
     background: url(Aqui la url de tu imagen) repeat;
     border: 2px solid black;
      }
      div.transbox
      {
      width: 400px;
     
      height: 180px;
     margin: 30px 50px;
     background-color: #ffffff;
      border: 1px solid black;
      /* para IE */
      filter:alpha(opacity=60);
      /* CSS3 standard */
     opacity:0.6;
     }
      div.transbox p
      {
      margin: 30px 40px;
     font-weight: bold;
      color: #000000;
      }
     </style>

    Para agregar :

    Código:

     
      <div class="background">
     <div class="transbox">
     <p>Hay algo dentro de esta caja.
      Hay algo dentro de esta caja.
    Hay algo dentro de esta caja.
      Hay algo dentro de esta caja.
     Hay algo dentro de esta caja.
      </p>
     </div>
      </div> 

    Para imagen transparnete muy bueno al pasar el mouse ya no se vuelve transpanrete :

    Aqui :

    <img alt="Ejemplo imagen" src="http://www.definicionabc.com/wp-content/uploads/caja-carton-box.jpg" onmouseout="this.style.opacity=0.4;this.filters.alpha.opacity=40" onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100" style="opacity: 0.4;" />

    Un poco mas y me olvido fuente :

    http://www.cssblog.es/ejemplos-con-la-transparencia-css/

    salu2! espero les haya gustado =)

      Fecha y hora actual: Jue Ago 16, 2018 3:57 am