 Border color |
  |
| Cameron |
 Sep 24 2006, 01:32 PM
Post
#1
|
|
Novice  Group: Members Posts: 28 Joined: 24-September 06 Member No.: 224  |
I'm adding little borders to some of the images on my site, www.creaturefeature.info. I just want to change the border color and I can't remember how to do that.
If someone would give me a little help I'd be grateful. |
  |
 
|
| jimlongo |
Sep 24 2006, 02:38 PM
Post
#2
|
|
This is My Life Group: Members Posts: 1,128 Joined: 24-August 06 From: t-dot Member No.: 16 |
|
|
|
|
| Christian J |
Sep 24 2006, 03:05 PM
Post
#3
|
|
. Group: WDG Moderators Posts: 9,648 Joined: 10-August 06 Member No.: 7 |
QUOTE(jimlongo @ Sep 24 2006, 09:38 PM)  If you're talking about the red borders around the pictures, they are part of the picture. You can't change them with html or css. But once they're removed you can styles the images with the various CSS border properties. See http://htmlhelp.com/reference/css/ http://www.w3.org/TR/CSS21/box.html#border-properties |
|
|
|
| Cameron |
Sep 24 2006, 03:25 PM
Post
#4
|
|
Novice Group: Members Posts: 28 Joined: 24-September 06 Member No.: 224 |
QUOTE(jimlongo @ Sep 24 2006, 03:38 PM) If you're talking about the red borders around the pictures, they are part of the picture. You can't change them with html or css. BTW you should declare a DOCTYPE and fix the errors that the validator shows. [br] Thanks a lot jimlongo--that's a whole lot of errors I didn't know about. Hopefully I can fix them all. Thanks!<br> What I really meant when talking about my border color was a black border whose color I am trying to change to red. This border is not part of the image, so I can change it. |
|
|
|
| jimlongo |
Sep 24 2006, 05:20 PM
Post
#5
|
|
This is My Life Group: Members Posts: 1,128 Joined: 24-August 06 From: t-dot Member No.: 16 |
I don't see a black border anywhere on your page.
|
|
|
|
| Cameron |
Sep 24 2006, 06:49 PM
Post
#6
|
|
Novice Group: Members Posts: 28 Joined: 24-September 06 Member No.: 224 |
On www.creaturefeature.info/rubythroatedhummingbird.html, I have a black border around the GIF slideshow of Ruby-throated hummingbirds. I want to change this border to red.
Thanks a ton for your help, all of you. |
|
|
|
| pandy |
Sep 24 2006, 07:15 PM
Post
#7
|
|
🌟Computer says no🌟 Group: WDG Moderators Posts: 20,730 Joined: 9-August 06 Member No.: 6 |
You mean where it says bordercolor="red" in your code?
<img src="animals/ruby_throated_hummingbird.gif" border="5" bordercolor="red"> What Chrisan said, use CSS. |
|
|
|
| jimlongo |
Sep 24 2006, 10:56 PM
Post
#8
|
|
This is My Life Group: Members Posts: 1,128 Joined: 24-August 06 From: t-dot Member No.: 16 |
here's a simple example of what Christian and pandy are referring to
a HTML file HTML <html> <head> <link rel="stylesheet" href="test.css"> <title>border style</title> </head> <body> <img src="ruby_throated_hummingbird.gif"> </body> </html> the html file has a link to an external stylesheet test.css CODE img { border-color: red; border-width: 10px; border-style: solid; } will give you a solid red 10px border  It's recommended you use a stylesheet to describe fonts, colors, and all other style elements. It keeps your html neater and makes changes easier, i.e., you could change all your borders with one change to the css instead of having to change every occurrence in your html document. This post has been edited by jimlongo: Sep 24 2006, 11:07 PM |
|
|
|
| Cameron |
Sep 25 2006, 07:26 PM
Post
#9
|
|
Novice Group: Members Posts: 28 Joined: 24-September 06 Member No.: 224 |
QUOTE(jimlongo @ Sep 24 2006, 11:56 PM) here's a simple example of what Christian and pandy are referring to a HTML file HTML <html> <head> <link rel="stylesheet" href="test.css"> <title>border style</title> </head> <body> <img src="ruby_throated_hummingbird.gif"> </body> </html> the html file has a link to an external stylesheet test.css CODE img { border-color: red; border-width: 10px; border-style: solid; } will give you a solid red 10px border It's recommended you use a stylesheet to describe fonts, colors, and all other style elements. It keeps your html neater and makes changes easier, i.e., you could change all your borders with one change to the css instead of having to change every occurrence in your html document. Whoa, cool! Thanks jimlongo! That's easy. The only problem is that it adds a border to every picture on my page. Can I change that somehow? |
|
|
|
| pandy |
Sep 25 2006, 07:57 PM
Post
#10
|
|
🌟Computer says no🌟 Group: WDG Moderators Posts: 20,730 Joined: 9-August 06 Member No.: 6 |
Yes, you can use a more specific selector. The simplest way (but not necessarily the best) is to give the images you want to have border a class. You can read all abut that if you follow the links Christian posted. Selectors are here:
http://www.htmlhelp.com/reference/css/structure.html |
|
|
|
| Cameron |
Sep 26 2006, 03:35 PM
Post
#11
|
|
Novice Group: Members Posts: 28 Joined: 24-September 06 Member No.: 224 |
QUOTE(pandy @ Sep 25 2006, 08:57 PM) Yes, you can use a more specific selector. The simplest way (but not necessarily the best) is to give the images you want to have border a class. You can read all abut that if you follow the links Christian posted. Selectors are here: http://www.htmlhelp.com/reference/css/structure.html <p> Can any of you give a sample of this I can use with my site? I read the CSS sheets and I understand them in basic terms, but I'd like to see a sample code so I can relate to it a little more. Thanks, -Cameron |
|
|
|
| jimlongo |
Sep 26 2006, 04:12 PM
Post
#12
|
|
This is My Life Group: Members Posts: 1,128 Joined: 24-August 06 From: t-dot Member No.: 16 |
QUOTE(Cameron @ Sep 26 2006, 04:35 PM) QUOTE(pandy @ Sep 25 2006, 08:57 PM) Yes, you can use a more specific selector. The simplest way (but not necessarily the best) is to give the images you want to have border a class. You can read all abut that if you follow the links Christian posted. Selectors are here: http://www.htmlhelp.com/reference/css/structure.html <p> Can any of you give a sample of this I can use with my site? I read the CSS sheets and I understand them in basic terms, but I'd like to see a sample code so I can relate to it a little more. Thanks, -Cameron You have 2 different class identifiers with various properties . . . CODE .blueborder { border-color: blue; border-width: 10px; border-style: solid; } .redborder { border-color: red; border-width: 10px; border-style: solid; } Two classes that can be applied to for instance an img tag HTML <img src="whatever.gif" class="redborder"> <img src="another.gif" class="blueborder"> <table class="blueborder"> the first image will have the red border applied, the second the blue border. The table will also have the blueborder class applied to it. |
|
|
|
| Cameron |
Sep 28 2006, 03:17 PM
Post
#13
|
|
Novice Group: Members Posts: 28 Joined: 24-September 06 Member No.: 224 |
I got it! Thanks for all your help, guys. I understand CSS now so I should be able to take a closer look at those sheets Christian sent me.
|
|
|
|
|
2 User(s) are reading this topic (2 Guests and 0 Anonymous Users)
0 Members:
|
Lo-Fi Version | Time is now: 16th April 2024 - 01:20 AM |
Invision Power Board
© 2024 IPS, Inc.
Licensed to: HTMLHelp.com, LLC