Color Code

It’s easy to spice up your website with some colorful links; in some tutorial, you’ll be shown how to use Hex color codes and the CSS color property to give your anchor tags some much-needed pop and how to use CSS to change the link color on hover. As far as CSS color is concerned, links, or tags, behave in the same way as regular text. This means to change the color of a link all you need to do is use the CSS color property on the anchor tag with whatever color Hex you want.

Hex code byte values range from 00, which is the lowest intensity of a color, to FF which represents the highest intensity. The color white, for example, is made by mixing each of the three primary colors at their full intensity, resulting in the Hex color code of #FFFFFF.

IDs are another way to style a tag using CSS. They are prefixed with a ‘#’ sign in CSS and are generally meant to be used only once on any given web page. Classes, on the other hand, are intended to be reused throughout a web page and are much more common than IDs. CSS classes are prefixed with a ‘.’ and multiple classes can even be attached to the same HTML element. Here we use a class with the same red Hex color code.

To change the color of your link on hover, use the :hover pseudo property on the link’s class and give it a different color. The Hover property can similarly be used on both IDs and elements themselves. Color is just one of many properties you can change using :hover, try experimenting with underlines, border colors, and backgrounds for fun.

Facebook Comments Box