Member Avatar for palavi

hi all,
i have a website in which i have used button as a image and wen i give link to dat image button its color is changing i used dreamweaver help but didnt work i will

<td width="58"  height="40" align="right" valign="middle"><a href="index7.html"> <img src="images/Home_2.jpg"/></a> </td>

i want color as it is but hre as soon as i give link i am getting color on dat link same is for others also

  • 2 Contributors
  • 7 Replies
  • 128 Views
  • 10 Hours Discussion Span
  • Latest Post Latest Post by macneato

Dani AI

Generated

Quick recap and next steps based on this thread: correctly fixed the image-border symptom; the blue/purple text colors you saw are the browser defaults for unvisited/visited links. The simple CSS you received will work, but to keep styles predictable across the site and to avoid Dreamweaver-generated clutter (like lots of .styleN classes and HTML comments inside <style>), prefer semantic classes and a single external stylesheet. That also makes it easy to style only certain link groups (for example, a navigation bar) without changing every anchor on the page.

A compact, modern pattern to put in your external CSS (different from the examples already posted) — namespace the rules so only specific links change, keep keyboard focus visible, and remove image borders via CSS:

/* in default.css */
.nav a { color: #8b1e1e; }             /* navigation link color */
.nav a:visited { color: #5d0f0f; }     /* visited within nav */
.nav a:hover, .nav a:focus { color: #e03b3b; outline: 2px solid #e03b3b; }

a img { border: none; }                /* image links: no border */

A few practical notes and links: keep the pseudo-class order in mind (use LVHA: :link, :visited, :hover, :active) so rules behave as expected; include :focus so keyboard users see which link is active; and remember some browsers restrict what :visited can change for privacy — you can read the details on MDN about :visited limits (MDN :visited). Also check color contrast against WCAG so links are readable (WCAG contrast guidance).

Troubleshooting checklist: move CSS to an external file and link it, clear the browser cache after edits, inspect the element with DevTools to see which CSS rule wins, and replace Dreamweaver’s generic .styleN classes with semantic names like .nav a or .cta-link so future edits are simple.

Recommended Answers

All 7 Replies

Member Avatar for macneato

Are you talking about a border of some kind? (since it is a image)...

Simply make sure the border property is set to 0.

<td width="58"  height="40" align="right" valign="middle"><a href="index7.html"> <img src="images/Home_2.jpg" border="0"/></a> </td>

That will do the trick.

Member Avatar for palavi

Hey thank u very much its correct i did as u said, but wat to do for the links for example,

<tr>
          <td height="25" align="left"> <a href="gp.html"> Great  personalities</a></td>
        </tr>

text color i have given for Great personalities in table as (#990000) = red,but as soon as i give href its color becomes blue and wen i click it on a browser it becomes purple which i dont like. i think we shud do some setting for link in Dreamweaver or use CSS styles which i did didnt work, got Browser error. i want text color to be red and wen i click some other color i want so can u help me plzz?? i ve many links happening same............

Member Avatar for macneato

Ok,

So to do this we will use CSS.

a:link {color: #990000; text-decoration: underline; }
a:active {color: #0000ff; text-decoration: underline; }
a:visited {color: #008000; text-decoration: underline; }
a:hover {color: #ff0000; text-decoration: none; }

The names should explain themselves... If you would like all of them not to appear with an underline, change the "text-decoration" property to none - the same as hover.

Member Avatar for palavi

Hi thanks, in CSS i already have this u plz tel wer shud i put ur code .

<style type="text/css">
<!--
.style2 {color: #FFFFFF}
.style4 {color: #808080}
.style6 {color: #990000}
.style13 {color: #006699; font-weight: bold; }
.style17 {color: #CCCCCC}
a:link {
	text-decoration: none;
}
a:visited {
	text-decoration: none;
}
a:hover {
	text-decoration: none;
}
a:active {
	text-decoration: none;
}
body {
	background-color: #FFFFFF;
}
.style20 {color: #330066}


-->
</style>

i am new to CSS, Dreamweaver has put this code, so wat to do?? since i need to change color of my wish for link before clicking and also to change color after clicking link ??.i shud give color in a:link property as red and wat abt color for after clicking which property to use.

Member Avatar for macneato 
<style type="text/css">
<!--
.style2 {color: #FFFFFF}
.style4 {color: #808080}
.style6 {color: #990000}
.style13 {color: #006699; font-weight: bold; }
.style17 {color: #CCCCCC}
a:link {color: #990000; text-decoration: underline; } /*Defines the style for normal unvisited links */
a:visited {color: #008000; text-decoration: underline; } /* Defines the style for visited links. */
a:active {color: #0000ff; text-decoration: underline; } /*Defines the style for active links.
A link becomes active once you click on it.*/
a:hover {color: #ff0000; text-decoration: none; }  /* Defines the style for hovered links.
A link is hovered when the mouse moves over it. /*
body {
	background-color: #FFFFFF;
}
.style20 {color: #330066}


-->
</style>

Hopefully that helps you out

Member Avatar for palavi

thanks it worked. Thank you very much for explaining all those properties.

Member Avatar for macneato

Not a problem at all... If you need any other help. Just ask.

Another piece of advice. Add your CSS into its own document. Then link it as follows:

<head>
<title> example </title>
<link href="default.css" rel="stylesheet" type="text/css" />
</head>

"default.css" being the name of your document. Save the file in the same folder as your htmls.

This will help alot when you would like to make changes site wide. Since all htmls will be linked to one document.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.