HTML - Image borders

[ayersart]

I have a page with many images on it, and each image has a link. How would I code it so that by default each image has no border, instead of specifing each image to have a 0 border?

 

[pixl8r]

You can try using CSS

img {
   border:0;
}

Hope it helps.

Wow JT that almost looked like you knew what you were doing!

 

[kpetursson]

CSS is the way to go.
For a good site covering HTML and CSS see

http://www.htmldog.com/

Kevin Petursson

I have a mind like a steel trap!
Nothing gets in,
Nothing gets out!
Just waiting for it to rust!

 

[dkdude]

Yup! CSS is the trick ;-)

To add to pixl8r's answer - you can even put in margins so the images line up nice!

img {
  border : 0px;
  margin : 5px;
}

Or, if you want to control each margin side:

img {
  border         : 0px;
  margin-top     : 10px;
  margin-right   : 20px;
  margin-bottom  : 30px;
  margin-left    : 40px;
}

The same can be done in shorthand (margin : top right bottom left):

img {
  border : 0px;
  margin : 10px 20px 30px 40px;
}

You can even claasify images as you like! Put this in the document head:

<style type="text/css">
img.typeOne {
  border : solid 5px red;
}

img.typeTwo {
  border : solid 5px blue;
}
</style>

Now you can use the classes like this:

<img class="typeOne" src="onePicture" width="100" height="50" alt="Picture Two" />
<br />
<img class="typeTwo" src="onePicture" width="50" height="75" alt="Picture Two" />

... and so on and so on ...

Have a look at the CSS reference here

http://www.w3schools.com/css/css_reference.asp

Regards


Jakob

 

[pixl8r]

Hehe... I would say you did better than "add" to my answer.

Wow JT that almost looked like you knew what you were doing!

 

[dkdude]

Yup ;-)

It's simply because I love to share knowledge - heh!

Regards


Jakob