Identificarse | Registrarse | FAQ
Anonymous

Remove border around image link

+ Publicar una respuesta

3 mensajes Página 1 de 1


Remove border around image link

por lisaja » Mar Sep 21, 2010 1:34 pm

I am on lesson 7 in the HTML tutorial and have learned to turn a image into a link (example 4). But how do I remove the blue border around the image? It doesn't look nice!

Thank you,

Lisa
Avatar de Usuario

lisaja

  • Mensajes: 6
  • Registrado: Mar Sep 21, 2010 2:24 pm

Re: Remove border around image link

por HTML.net » Mar Sep 21, 2010 3:23 pm

lisaja escribió:..how do I remove the blue border around the image?


Hi Lisa,

This is best done with CSS which is next step after HTML. But here is a hint:

<a href="http://www.html.net"><img src="logo.png" style="border-style: none" /></a>

- Andreas, HTML.net
Avatar de Usuario

HTML.net
Site Admin

  • Mensajes: 1194
  • Registrado: Sab Sep 11, 2010 11:24 am
--
Show some love for HTML.net on Twitter, Facebook and Google: Use the buttons on top of all pages.

Re: Remove border around image link

por Maujor » Mar Sep 21, 2010 3:29 pm

To get rid of the blue border you can use the border attribute for the img element like so:
HTML:
Código: Seleccionar todo
<a href="#"><img src="path to image"  alt="" border="none"></a>

This isn't a good solution since it mixed up presentation with markup. So a better solution is using style rule. (Have you already read the HTML.net CSS tutorial at:http://html.net/tutorials/css/?
CSS:
Código: Seleccionar todo
<style type="text/css">
a img {border:none;}
</style>

HTML:
Código: Seleccionar todo
<a href="#"><img src="path to image"  alt=""></a>
Avatar de Usuario

Maujor

  • Mensajes: 3
  • Registrado: Mar Sep 21, 2010 3:05 pm
--
Maurício "Maujor" Samy Silva
http://maujor.com


+ Publicar una respuesta

Página 1 de 1