Skip to content
View in the app

A better way to browse. Learn more.

Web Designer Forum

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

styling links

Featured Replies

<!doctype html>

<html>

<head>

<style>

ul

{list-style-type:none;}

 

ul li a

{

text-decoration:none;

}

 

a:link {color:red; }

a:visited { color:green;}

a:hover { color:black;}

a:active {color:yellow; }

</style>

</head>

<body>

<div>

<ul>

<li><a href="">HOME</a></li>

<li><a href="">ABOUT</a></li>

<li><a href="">SUPPORT</a></li>

<li><a href="">CONTACT</a></li>

</div>

</body>

</html>

i am currently learning web design from w3schools.com..The above code seems not to work because the href attribute is empty causing the a:link{color to be ineffective} .but once i replace the href attributes with values.. the a:link{color:red} becomes valid....

 

secondly,each time i click on a link the a:visited{color:green;} works fine. but when i click the back button on my browser, the green button still remains active. if i click on another link again it becomes green.if i click back i now have 2 green visited links. wheni repeat this same process for all the links i now have four visited links all showing green.

 

is this normal and why does the links act strangely..

  • Author

Put a hash tag in the Greg attribute so it would be <a href="#">

 

I just inserted it. the a:link{color:red} now works. but the a:visited{color:green} still conflicts on all the links. if i click d home page , it becomes green. if i click d back button on my browser and click on the contact link it becomes green also making two links green @ d same time.if i repeat for the other links .. all becomes green @ d same time

Edited by gcrest

<!doctype html>

<html>

<head>

<style>

ul

{list-style-type:none;}

 

ul li a

{

text-decoration:none;

}

 

a:link {color:red; }

a:visited { color:green;}

a:hover { color:black;}

a:active {color:yellow; }

</style>

</head>

<body>

<div>

<ul>

<li><a href="">HOME</a></li>

<li><a href="">ABOUT</a></li>

<li><a href="">SUPPORT</a></li>

<li><a href="">CONTACT</a></li>

</div>

</body>

</html>

i am currently learning web design from w3schools.com..The above code seems not to work because the href attribute is empty causing the a:link{color to be ineffective} .but once i replace the href attributes with values.. the a:link{color:red} becomes valid....

 

secondly,each time i click on a link the a:visited{color:green;} works fine. but when i click the back button on my browser, the green button still remains active. if i click on another link again it becomes green.if i click back i now have 2 green visited links. wheni repeat this same process for all the links i now have four visited links all showing green.

 

is this normal and why does the links act strangely..

 

I open this website w3schools.com and i learn about HTML coding.

  • Author

so you dont want it to go green?

 

from what i learnt, the link becomes green cos i visited it,thats fine. but when i click another link, it should be d new link becoming green and nor the former link still retaining the green..lol thus having two green links at the same time

Edited by gcrest

From your code above all links will be red before you click them, go black whilst your cursor is on them, will flash yellow when you're actually clicking on them and turn green if the link goes to a page you have previously visited. Is this not what is happening?

  • Author

From your code above all links will be red before you click them, go black whilst your cursor is on them, will flash yellow when you're actually clicking on them and turn green if the link goes to a page you have previously visited. Is this not what is happening?

 

yes..dont know if am the one getting it all wrong..anyway i am still learning. I'm gonna watch out for changes as soon as i continue to add contents.. tanks to everyone..i like this forum

secondly,each time i click on a link the a:visited{color:green;} works fine. but when i click the back button on my browser, the green button still remains active. if i click on another link again it becomes green.if i click back i now have 2 green visited links. wheni repeat this same process for all the links i now have four visited links all showing green.

 

is this normal and why does the links act strangely..

Yes, it is normal because all the pages have been visited, so they all have green links. You also have to remember that IE treats active differently from other browsers. Read up on using a:focus for use in other browsers as older versions IE6 IE7, don't process focus, they use active instead, although IE8 and above do process focus. http://reference.sit...eudoclass-focus

Edited by Wickham

Create an account or sign in to comment

Account

Navigation

Search

Search

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.