文字陰影和超連結偽類
阿新 • • 發佈:2022-03-28
超連結偽類
正常情況下,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>