Home >Web Front-end >CSS Tutorial >How to set hyperlink in css? How to set css hyperlink style
How to set hyperlink in css? How to set css hyperlink style
- 不言Original
- 2018-08-18 13:56:547102browse
The content of this article is about how to set up css hyperlinks? The setting method of CSS hyperlink style has certain reference value. Friends in need can refer to it. I hope it will be helpful to you.
1. Simple hyperlink
box.html
<!doctype html><html><head>
<mate charset="utf-8">
<title>超链接</title>
<link href="link.css" type="text/css" rel="stylesheet"></head><body>
<p>
<a href="#" class="link">首页</a>
</p></body></html>link.css
a.link{
text-decoration:none;
font-size:23px;
display:black;
}2. Pseudo-class: a certain A certain state of the attribute;
4 states of the hyperlink:
link (state when not accessed);
visited (status that the user has visited);
hover(the state when the mouse passes over);
active (state when the mouse is clicked);
link.css
a:link{
font-size:41px;
color:black;
text-decoration: none;
}
a:visited{
font-size:23px;
color:pink;
background-color: pink;
}
a:hover{
font-size: 34px;
color:green;
background-color: #123456;
}
a:active{
color:blue;
font-size: 60px;
background-color: #498544;
}Related recommendations:
[CSS writing] Hyperlink style_html/css_WEB -ITnose
How to implement hyperlink background switching with CSS_html/css_WEB-ITnose
The above is the detailed content of How to set hyperlink in css? How to set css hyperlink style. For more information, please follow other related articles on the PHP Chinese website!