Tecnología

Inicio

¿Cómo deshacerse de una frontera azul a partir de imágenes en HTML

January 14

Cuando un navegador Web se encuentra con una etiqueta de imagen rodeada de un enlace en el código fuente HTML de una página, si hay propiedad borde se establece, el navegador hace que un borde azul de un píxel alrededor de la imagen. Esto indica claramente que el visitante que una imagen es también un enlace, y cuando se hace clic se llevará al visitante a otra página. Es posible que desee detener el borde azul de aparecer si no encaja con el diseño general de la página. Añadir un estilo CSS a la página para quitar el borde de todos los enlaces de imagen.

Instrucciones

1 Abra una aplicación de diseño web o editor de texto, a continuación, abra la página HTML que desea trabajar.

2 Comprobar para ver si la página ya se utiliza una hoja de estilos CSS. Busque una línea similar a la siguiente:

<Link href = "main.css" rel = "stylesheet" type = "text / css" />

Esto indica que la página utiliza una hoja de estilos externa, por lo que abrir el archivo CSS referencia para agregarlo a su nuevo estilo.

3 Añadir las siguientes líneas entre el código HTML "<head>" y "</ head>" etiquetas si no hay una hoja de estilos en uso, para definir una hoja de estilo local para la página:

<Style type = "text / css">

</ Style>

4 Añadir el siguiente estilo a la parte superior de la hoja de estilos externa, o entre el "<style>" y "</ style>" etiquetas que definen la hoja de estilo local:

un img {

border: none;

}

Esto le indica al navegador Web que no deberían existir bordes alrededor de las imágenes contenidas en un enlace. estilos posteriores pueden anular este estilo en la hoja de estilo para permitir que ciertas imágenes que tienen un borde personalizado, si es necesario.

5 Guarde la página y la hoja de estilos externa, si procede, a continuación, cargar los archivos en el servidor Web. Ver la página en un navegador Web para ver las imágenes en los enlaces que aparecen sin un borde.

Consejos y advertencias

  • Muchos tutoriales sugieren establecer el atributo img "frontera" a cero para desactivar el borde de la imagen, pero el atributo está en desuso a partir del momento de la publicación, a fin de utilizar un estilo CSS en su lugar.