Printable Version of Topic
Click here to view this topic in its original format
HTMLHelp Forums _ Markup (HTML, XHTML, XML) _ How to stop link colour and underline
Posted by: mattykg1987 Feb 24 2024, 11:17 AM
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. 
Posted by: pandy Feb 24 2024, 02:19 PM
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.
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.
Posted by: mattykg1987 Feb 24 2024, 03:46 PM
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.
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.
Thanks for your reply, i am struggling to enter this into my css I provide above can you help me?
Posted by: pandy Feb 24 2024, 11:08 PM
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?
Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)