highlight text color
Posted: 15 April 2006 10:39 PM   [ Ignore ]
Newbie
Rank
Total Posts:  6
Joined  2006-03-27

go to http://www.mad4milk.net/ and highlight the text with your mouse. see how the highlight is pink intstead of the boring blue? does anyone know how to do this?

Profile
 
 
Posted: 16 April 2006 07:40 AM   [ Ignore ]   [ # 1 ]
Newbie
Rank
Total Posts:  17
Joined  2006-03-09

its done using css pseudo-classes specific for <a>nchor, link tag.
link can have these pseudoclasses:

a:link   (default, initial state)
a:hover   (when cursor is over link)
a:active   (link that point to self, page you are on)
a:visited (err..visited link?)

so, on your example, they are used as selectors to define different beahavior on different state. this is c/p from their css:

#nav a:link, #nav a:visited {
displayblock;
height18px;
background-positionbottom left;
font-size1.2em;
color#fff;
text-decorationnone;
border0;
padding0;
text-shadow2px 2px 1px #98C3E0;
}
.......

#nav a:hover, #nav a:active, #nav a:focus {
background-positiontop left;
background-colortransparent;
color#F55B99;
text-shadownone;
border0;

play here:
http://www.w3schools.com/css/tryit.asp?filename=trycss_link
and later click on logo in upper left corner to take you to school ;)

Profile
 
 
Posted: 16 April 2006 08:48 AM   [ Ignore ]   [ # 2 ]
Newbie
Rank
Total Posts:  6
Joined  2006-03-27

no not the links, just the text. when you drag your mouse over the text and select/highlight it. (you have to be in FF to see it)

Profile
 
 
Posted: 16 April 2006 10:15 AM   [ Ignore ]   [ # 3 ]
Newbie
Rank
Total Posts:  17
Joined  2006-03-09

oops, sorry. i was still sleepy :)

its done with this lines, have a look at theirs css :

::-moz-selection{
background
#fbdbe8;
color#F55B99;


::selection {
background
#fbdbe8;
color#F55B99;

http://www.w3.org/TR/css3-selectors/#UIfragments
http://www.quirksmode.org/css/selection.html

but, be carefull, use with moderation and care :) those settings are basicly user-side and websites should not messs with.
imho.

Profile
 
 
Posted: 16 April 2006 10:49 AM   [ Ignore ]   [ # 4 ]
Newbie
Rank
Total Posts:  17
Joined  2006-03-09

ok, heres the fun, and more usefull part: if you want to change that behavior for ANY page you visit, go to your profile chrome directory: on windowse it is usually in
C/Documents and Settings/username/Aplication Data/Mozilla/Firefox/Profiles/Chrome

there youll find userChrome-example.css (for look of FF’s window) and userContent-example.css (to add or overide style of pages you visit)
so, open userContent-example.css and at the end of it add

::-moz-selection{background#ffff00; !important} 

::selection {background#ffff00; !important} 

save changes, rename file to userContent.css (cut out “-example”)

and there you have it. on next startup of FF, any selection, anywhere will have yellow bg.

Profile
 
 
Posted: 16 April 2006 10:16 PM   [ Ignore ]   [ # 5 ]
Newbie
Rank
Total Posts:  6
Joined  2006-03-27

thanks heaps :)

Profile