How to style alt text color?

Question

I want to style alt text color of map area image -> alt="Victoria's Secret" By default is blue, but I want to be red! I tried some methods without sucess... Any help?

This is my code:

<map name="Map" id="Map">
        <area shape="rect" coords="22,4,126,50" href="http://www.victoriassecret.com/" target="_blank" alt="Victoria's Secret"/>

Answer 1

Can you be more specific in your target platform, language etc.

I am assuming you are trying to change the alt text in a HTML page.

This is unfortunately not possible see here as alt text is set by the browser/operating system.

Aside from which, alt text is generally used to improve the accessibility of the site. You should probably leave this alone even if you could change it.

If you want to create a tooltip (popup text), then there are many DHTML scripts out there for doing that such as this

Answer 2

"Alt text" is, contrary to popular belief, not the system-generated message that shows up when hovering over items. The text you see in those is set in the title attribute of the element and cannot be styled.

However, the actual alt text, being the text that is displayed when an image is not loaded can be styled like you would style text in any other element. For example:

img { color: red; text-align: center; }

will make the alternate text red and horizontally center it within the container.

However, if that is not at all what you meant, and you meant the system-generated tooltips, you'll want to follow ose's advice and create a custom tooltip, which will probably take a bit more work than you intended.

I'd advice you to go with a pure HTML/CSS tooltip though, as not everyone has JavaScript on. This seems like an okay one I just Googled up: Pure CSS Tooltips