Realicé una página web grande sobre México, con texto e imágenes. Me piden que haya sobresalir más las imágenes agregandoles un marco.
¿Cómo puedo hacerlo?
Recibe ayuda de expertos
Es gratis y fácil
Respuestas, votos y comentarios
Recibe puntos, vota y da la solución
Realicé una página web grande sobre México, con texto e imágenes. Me piden que haya sobresalir más las imágenes agregandoles un marco.
¿Cómo puedo hacerlo?
Con jQuery sería algo así:
$('img').wrap('<div style="border:1px solid red;padding:10px"></div>');
Aunque yo lo haría como dice lvillasante, con puro CSS.
Lo puedes hacer de la sigueinte manera:
HTML
<img class="img-border" alt="image_border" src="images/photos/photo_01.jpg">
CSS
.img-border {
padding: 4px;
background-color: #fff;
border: 1px solid #ccc;
border: 1px solid rgba(0, 0, 0, 0.2);
-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}