Home | About | Help Center | Privacy Policy

August 2nd, 2009

How to change the font color and background color of selected text using only css


Websites having huge amount of contents and tutorials are often used for the references and usually bookmarked. Do you think upon delivering a unique gumption of feelings to your users who used your contents for their source of information’s? The best way is to change the background and the color of the selected text on the website.

background-color

You can easily change the background and the text color of the selected text using CSS properties defined below

::-moz-selection{
    background:#cc3333;
    color:#fff;
}

::selection {
    background:#cc3333;
    color:#fff;
}

In case you want to implement this into your Wordpress blogs then you just need to open the Wordpress theme directory ( wp-content/themes/yourthemename/style.css) and the above CSS files into your style sheet.background-color-change-text-css

Note:

  1. I used the red shade (#cc3333) because its my default color scheme, you may used the colors matched with your webpage.
  2. This method works like cream and is compatible with with Mozilla Firefox and Safari. This doesn’t work on Internet Explore.
  3. We defined
    <strong>::-moz-selection</strong>

    for Mozilla Firefox whereas ::selection is used for default Safari browsers.



You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackbackfrom your own site.

Subscribe to our FREE Rss Feed

Hot in Social Media


10 Ways Social Media Can Help Your Business

10 Best Social Media Case Studies

10 Tips To Become Social Without Using Social Media

Top 10 Tips To Enhance Personal Branding

What's Hot

Similar Interesting Posts

Tutorials On

2 Responses to “How to change the font color and background color of selected text using only css”

  1. Thanks for the Tip! I needed some CSS help desperately!

  2. L’me know how can i help you ?

Leave a Reply

CommentLuv Enabled

Additional comments powered by BackType

    Follow @honeytech On Twitter

    @babychen Yeah, One can create Huffingtonpost with the help of WP, twicks, custom plugins &amp; content structuring. ;P
  • Subscribe For Tips


  • Top Fans Of The Day

  • Sponsors Zone

Hot Tags

Social Linux free browser tips How to Internet Web design ubuntu Windows Firefox mobile Designs WordPress Plugin Social media iphone open source mistakes blogging google