html - text-decoration not working for visited state link -
i'm new on css , trying understand how links modified due changed state. on scenario, want change text-decoration line-through when link on visited state. however, neither on mozilla nor chrome browser, text-decoration of text content not updated line-through when link on visited state, shown below. did go wrong?
please notify color updated (to green) when link state changed visited while text-decoration stays same (see. demo #1);
note: there bug report mozilla same issue: mozilla bug #645786 , on bug report. problem reproduce tag.class:state selector (a.:visited) (see demo #2)
demo #1
<!doctype html> <html> <head> <style> a:link { color: red; text-decoration: none; } a:visited { color: green; text-decoration: line-through; } a:hover { color: blue; } a:active { color: yellow; } </style> </head> <body> <p> <b> <a href="http://google.com" target="_blank">this link</a> </b> </p> </body> </html>demo #2 --selector class
<!doctype html> <html> <head> <style> a.linkclass:link { color: red; text-decoration: none; } a.linkclass:visited { color: green; text-decoration: line-through; } a.linkclass:hover { color: blue; } a.linkclass:active { color: yellow; } </style> </head> <body> <p> <b> <a class="linkclass" href="http://google.com" target="_blank">this link</a> </b> </p> </body> </html>
there limitation styling visited links;
limits visited link styles
you still able visually style visited links, there limits on styles can use. following properties can applied visited links:
color background-color border-color (and sub-properties) outline-color color parts of fill , stroke properties
text-decoration styling not permitted due user's privacy issues.
Comments
Post a Comment