CSS: In page links colour change

• 

  drlizdavies · Member · Apr 11, 2016 at 10:18 am

  • Copy link
  • Add topic to favorites

  Hello folks, I’m using the Ryu theme and am wanting to change the colour for individual links on a page.

  I first went with this:

  a:link {color:#CCCCCC;} /* unvisited link */
  a:visited {color:#404040;} /* visited link */
  a:hover {color:#FFFFFF;} /* mouse over link */

  However, i then realised that ALL links – menu, titles etc. – on site changed colour and i want to be able to just change links that are within page text – en masse as opposed to one at a time!

  Any help would be much appreciated.

  Thanks

  The blog I need help with is: (visible only to logged in users)

• 

  thesacredpath · Member · Apr 11, 2016 at 9:34 pm

  • Copy link

  If you are wanting to change only the link colors on a single page, you would need to use the unique CSS class for that page set in the opening body HTML tag. Using the About page on the site you reference, this would be the code to change the link colors.

  .page-id-574 a {
      color: #ccc;
  }
  .page-id-574 a:visited {
      color: #404040;
  }
  .page-id-574 a:hover {
      color: #ffffff;
  }

  Use the web inspector in your browser and view the source HTML code and you will find the unique page id CSS class in the opening body tag.

• 

  drlizdavies · Member · Apr 12, 2016 at 8:38 am

  • Copy link

  Thanks for the suggestion thesacredpath, really appreciate it. Will give that a go.

• 

  thesacredpath · Member · Apr 12, 2016 at 6:30 pm

  • Copy link

  You are welcome and let me know if you have any problems, or additional questions.