How to stop link colour and underline Options

[mattykg1987]

As the title states how do i stop link colour and underline when hovering over or allready clicking on it this is the code i have for it in my css.

header{text-align: center;background: #fff;}
header .top-header{background: #292A2C;color: #fff;}
header .top-header i.fa{margin: 5px 2px 0;}

.logo {color: #333;padding: 20px 0 30px; }
.logo a{font-family: 'Dancing Script', cursive;font-size: 80px;color: #333;font-weight: bold;display: block;line-height: 1.3; }
.logo span{font-size: 16px;letter-spacing: 1px;}
@media(max-width:767px){
.logo{padding: 30px 0 20px;}
.logo a{font-size: 65px;}
.logo span{font-size: 16px;}
}

Thanks to anyone that can help.

[pandy]

You style the different link states as you wish to have them. Note that you need to have the rules in this specific order. That has to do with specificity. For example :link always applies. So if you place :link after for example :hover it will override the rule for :hover, because it's still a link even if it's hovered.

CODE

a:link      { ... }
a:visited   { ... }
a:focus     { ... }
a:hover     { ... }
a:active    { ... }

If you want the link to look the same in all stated it's enough to style A. Give it the color you want and remove underline and outline should be enough IIRC.

CODE

a { color: green; text-decoration: none; outline: none }

[mattykg1987]

You style the different link states as you wish to have them. Note that you need to have the rules in this specific order. That has to do with specificity. For example :link always applies. So if you place :link after for example :hover it will override the rule for :hover, because it's still a link even if it's hovered.

CODE

a:link      { ... }
a:visited   { ... }
a:focus     { ... }
a:hover     { ... }
a:active    { ... }

If you want the link to look the same in all stated it's enough to style A. Give it the color you want and remove underline and outline should be enough IIRC.

CODE

a { color: green; text-decoration: none; outline: none }

Thanks for your reply, i am struggling to enter this into my css I provide above can you help me?

[pandy]

Well, what exactly is it you want to do? If you remove all styling no one will detect the links, so how do you want them to look? And do you want all links to look like this or just some of them?