Wednesday 21 September 2011

CSS Changing color of highlighted text?

I've seen websites that have highlighted text orange, instead of blue. Can you guys tell me how to change the color, background, etc of highlighted text via CSS? By highlighted text I mean the type where your mouse clicks and drags through some text, thus making it a blue background.
CSS Changing color of highlighted text?
You can do this with CSS, but only in some browsers. See the link below for details.
CSS Changing color of highlighted text?
%26lt;!DOCTYPE html PUBLIC %26quot;-//W3C//DTD HTML 4.01 Transitional//EN%26quot; %26quot;http://www.w3.org/TR/html4/loose.dtd%26quot;%26gt;

%26lt;html%26gt;%26lt;head%26gt;

%26lt;meta http-equiv=%26quot;content-type%26quot; content=%26quot;text/html; charset=iso-8859-1%26quot;%26gt;

%26lt;title%26gt;%26lt;/title%26gt;

%26lt;meta name=%26quot;description%26quot; content=%26quot;%26quot;%26gt;

%26lt;meta name=%26quot;keywords%26quot; content=%26quot;%26quot;%26gt;

%26lt;meta name=%26quot;author%26quot; content=%26quot;%26quot;%26gt;

%26lt;meta name=%26quot;generator%26quot; content=%26quot;MSS Website Studio by van IJperen Software Inc. - %26gt;http://www.marsansoft.nl%26quot;%26gt;

%26lt;style style=%26quot;text/css%26quot;%26gt;

body { color: #000; background-color: #fff; font-family: arial; font-size: 1em; }



/* START Normal Link Styles */

a { text-decoration: none; padding: 3px; }

a:link { color: #00f; background-color: #fff; }

a:visited { color: #600; background-color: #066; }

a:hover { color: #fff; background-color: #000; }

a:active { color: #606; background-color: #660; }



/* START Pseudo-link Styles */

a.posts { text-decoration: none; padding: 3px; }

a:link.posts { color: #fff; background-color: #00a; }

a:visited.posts { color: #fff; background-color: #066; }

a:hover.posts { color: #fff; background-color: #060; }

a:active.posts { color: #fff; background-color: #600; }

%26lt;/style%26gt;

%26lt;/head%26gt;

%26lt;body%26gt;

%26lt;p%26gt;As a last point, adding onfocus=%26quot;this.blur()%26quot; into each link code will get rid of that annoying dotted line which appears when the link is clicked.%26lt;/p%26gt;

%26lt;p%26gt;Please see %26lt;a class=%26quot;posts%26quot; href=%26quot;http://www.microsoft.com%26quot; title=%26quot;Microsoft.com%26quot;%26gt;Microsoft.com%26lt;/a%26gt; for more.%26lt;/p%26gt;

%26lt;p%26gt;Please see %26lt;a href=%26quot;http://www.msn.com%26quot; title=%26quot;MSN.com%26quot;%26gt;MSN.com%26lt;/a%26gt; for more.%26lt;/p%26gt;

%26lt;/body%26gt;%26lt;/html%26gt;



Ron