Zaloguj | Zarejestruj | FAQ
Anonymous

Remove border around image link

+ Odpowiedz

Posty: 3 Strona 1 z 1


Remove border around image link

przez lisaja » Wt wrz 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 użytkownika

lisaja

  • Posty: 6
  • Dołączył(a): Wt wrz 21, 2010 2:24 pm

Re: Remove border around image link

przez HTML.net » Wt wrz 21, 2010 3:23 pm

lisaja napisał(a):..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 użytkownika

HTML.net
Site Admin

  • Posty: 1194
  • Dołączył(a): So wrz 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

przez Maujor » Wt wrz 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:
Kod: Zaznacz cały
<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:
Kod: Zaznacz cały
<style type="text/css">
a img {border:none;}
</style>

HTML:
Kod: Zaznacz cały
<a href="#"><img src="path to image"  alt=""></a>
Avatar użytkownika

Maujor

  • Posty: 3
  • Dołączył(a): Wt wrz 21, 2010 3:05 pm
--
Maurício "Maujor" Samy Silva
http://maujor.com


+ Odpowiedz

Strona 1 z 1