¿Cómo expresar las medidas expresadas en pixeles de una capa imagen en porcentaje?

0 votos
preguntado por gerardo (330 puntos) Feb 4 en HTML

Tengo el siguiente código:

<! DOCTYPE html>
<html lang="es">
<head>
<title>hover imagen</title>
<style>
body{font-family: Arial,serif;}
.clear{width:100%;clear:both;}
/*Estilos Base*/
.contenedor-img {
max-width: 300px;
max-height: 200px;
float: left;
overflow: hidden;
position: relative;
/*text-align: center;
cursor: default;*/
background: #fff;
}
.contenedor-img .mascara{
width: 300px;
height: 200px;
position: absolute;
overflow: hidden;
top: 0;
left: 0;
}
.contenedor-img img {
display: block;
position: relative;
}

/*Ejemplo 2*/
.ejemplo-2 img { 
transition: all 0.2s ease-in;
}
.ejemplo-2 .mascara { 
background-color: rgba(1,192,225,0.8);
width: 300px;
padding: 60px;
height: 300px;
opacity: 1;
transform: translate(300px, -200px);
transition: all 0.5s ease-in-out;
}

.ejemplo-2:hover .mascara { 
opacity:1; 
transform: translate(-96px, -120px);
}

</style> 
</head>
<body>
<div class="contenedor-img ejemplo-2"> 
<img src="imagenes/imgejemplo.jpg" /> 
<div class="mascara"></div> 
</div> 
</body>
</html>

Como expresar los valores que están en pixeles, ¿en porcentajes?

Por favor, accede o regístrate para responder a esta pregunta.

Preguntas relacionadas

0 votos
3 respuestas
preguntado por gerardo (330 puntos) Jul 19, 2016 en HTML
0 votos
3 respuestas
preguntado por David Delgado (120 puntos) Ene 28, 2016 en HTML
0 votos
1 respuesta
preguntado por jabnsg (160 puntos) Ene 28, 2016 en HTML
0 votos
0 respuestas
0 votos
0 respuestas
Bienvenido a Dudas de Programación, donde puedes hacer preguntas y recibir respuestas sobre los problemas más frecuentes de los lenguajes de programación, frameworks de desarrollo y bases de datos que utilices. Foro de Línea de Código
...