How to create link that changes color when hovering mouse over it

By -

This is quite simple all we need to do is to use the pseudo classes to achieve this effect.
Here is how you can achieve this effect

<html>
<a href=”somepage.html”>My Page LInk</a>
</html>

CSS  to change color of link when hovering over it:

<style>
a:hover{color:#FC0;}
</style>

Comments

Post a Comment

Thanks for Visiting for any questions or suggestions please comment below
Cheers,

Check out

CSS Sprites | What are They?

By -
Image
CSS Sprites most web developers should have heard this term, so what is it ?. CSS Sprite bunch of other images transformed into one Big Image. The origin of the term "sprites" comes from old school computer graphics and the video game industry. A dding Sprites to our websites helps with webpage performance, since the webpage has to make only one request to the server, which will fetch the Sprite (the Big image) which includes all the other images that you want to use in your webpage. since the server makes only one request your page will load a lot faster compared to conventional way of linking each images separately. H ere is a demo on how to use CSS Sprites. further more there a many Sprite generators online to create CSS Sprites all you have to do is upload a bunch of images to these Online tools and they will generate the Sprite for you. Signup image Signup confirmation image Two images made into one image As you see above the are two images ca...
Know more »

Adding a button in HTML | styling a button

By -
Image
To add a button in a HTML page use <input> tags and specify the type as button like so <input type=”button” value=”submit” action=”submit.php”> this code will be rendered in browser like in Figure 1.1 Add caption Further more if you wish to style this button we can apply a set of CSS rules to make the buttons look pretty here are a few examples: Download code for these buttons here
Know more »

Remove Scrollbars from syntaxhighlighter

By -
Image
It's easy to remove the scrollbars that's generated by the syntax highlighter plugin  go to the CSS file you using provided in the plugin for example" shCoreDefault.css" or the cutom css theme file you're using. and find class   .syntaxhighlighter  and comment or remove   overflow: auto !important; that's it the scrollbar's that's created by the plugin is gone and you'll get the default scroll bars of the browser window Comment the lines shown above
Know more »

HTML5 Semantic Tags | What do they mean

By -
HTML markup has changed a lot especially when the WHATWG introduced semantic tags.   Semantic Tags? What do they mean. The Semantic Markup helps Humans and Machines to Interpret the HTML markup in a more meaningful way. Which helps the HTML markup to be structured in a more meaningful way. remember adding semantic tags to your HTML5 markup wont change the apperance of your page, but it Gives more meaning to your Markup.   Here is a list of few HTML5 semantic tags. <section>  </section> <article>  </article> <header>    </header> <nav>          </nav> <aside>      </aside> <footer>    </footer> As you see above the above tags wont make our web pages pretty but it gives more meaning to the markup.
Know more »

How CSS3 Works

By -
CSS works with HTML, but it’s not HTML. It’s a different language altogether. While HTML provides structure to a document by organizing information into headers, paragraphs, bulleted lists, and so on, CSS works hand-in-hand with the web browser to make HTML  look  good. For example, you might use HTML to turn a phrase into a top-level heading, indicating that it introduces the content on the rest of the page. However, you’d use CSS to format that heading with, say, big and bold red type and position it 50 pixels from the left edge of the window. In CSS, that text formatting comprises a style—a rule describing the appearance of a particular portion of a web page. A style  sheet  is a set of these styles. You can also create styles specifically for working with images. For instance, a style can align an image along the right edge of a web page, surround the image with a colorful border, and place a 50-pixel margin between the image and the surrounding text....
Know more »

HTML5 | LocalStorage

By -
HTML5 LocalStorage a feature that's been added to HTML5 specification, which enables storing data on clients machine, which can be retrieved and manipulated for future use unless the user clears the cache from browsers. Though we can store data there is a limitation as in how much we can store, the current max size of storing is 5Mb, which is quite a big amount, lets look how to store  and retrieve data on client's machine Storing data: To store data we use the native localStorage.setItem(key,value) method which expects two arguments as shown the key and the value like so: localStorage.setItem('user_name','purush'); Retrieving Data: To Retrieve data we use the native localStorage.getItem(key) method which expects one argument as shown which is the key, lets retrieve the previously stored data localStorage.getItem('user_name'); this will return 'purush' Clearing Data: To remove or clear stored data we can use either localStorage.rem...
Know more »

Login form | Using CSS3

By -
Image
Here is an awesome demo of a login form , which makes good use of CSS3 and HTML5. In this demo, i have made extensive use of gradients, text-shadows and box-shadows to achieve a beautiful and modern looking login form. The design of this login form was originally taken for codrops.com, hope you'll like and use this login form in your projects. ViewDemo |   Download Source login form login form Onfocus
Know more »

HTML Tags | Adding Scripts in HTML

By -
Adding Scripts in HTML (i.e. JavaScript, Action script and others) requires the use of opening and closing <script> tags. The script is entered between theses tags. Here is an example: <script> //this is just an example for adding scripts $(document).ready(function(){ $(‘h1’).click(function(){ $(this).addclass(‘.animate’) }); }); </script> To included external script files we have to included the ‘src’ attribute in the script tags like so <script src=http:/faqwebdevelopmenet.js type=”text/javascript”></script> In the above HTML code the ‘src’ attribute specifies the source location of the script file and type attribute specifies the type of script being used. (Note: in HTML5 you don’t need to specify the type attribute the browsers will automatically understand the type of script).   
Know more »