文本阴影和超链接伪类

超链接伪类

正常情况下，a：hover

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Title</title>
 6 
 7     <style>
 8         /*默认的颜色*/
 9         a{
10             text-decoration: none;
11             color: black;
12 
13         }
14         /*鼠标悬浮的状态（重点)*/
15         a:hover{
16             color: #3cbda6;
17             font-size: 30px;
18         }
19         /*鼠标按住未释放的状态*/
20         a:active{
21             color: green;
22         }
23         a:visited{
24             color: red;
25         }
26         /*text-shadow:阴影颜色，水平偏移，垂直偏移，阴影半径*/
27         #price{
28             text-shadow: 5px 5px 5px red;
29         }
30     </style>
31 
32 </head>
33 <body>
34 
35 <a href="#">
36     <img src="../static/imgs/1.jpg" alt="">
37 </a>
38 
39 <p>
40     <a href="#">你好：Java</a>
41 </p>
42 
43 <p>
44     <a href="">我是：Java</a>
45 </p>
46 <p id="price">
47     ￥12
48 </p>
49 
50 </body>
51 </html>
超链接伪类

 

posted @ 2022-03-27 23:07  doremi429  阅读(21)  评论(0)  编辑  收藏  举报