05.练习-按钮练习.html 1019 B

123456789101112131415161718192021222324252627282930313233343536373839
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7. <title>按钮练习</title>
  8. <style>
  9. a:link{
  10. display: block;
  11. width: 93px;
  12. height: 29px;
  13. background-image: url('./images/link.png');
  14. }
  15. a:hover{
  16. background-image: url('./images/hover.png');
  17. }
  18. a:active{
  19. background-image: url('./images/active.png');
  20. }
  21. /*
  22. 图片属于网页中的外部资源,外部资源都需要浏览器单独发送请求加载,
  23. 浏览器加载外部资源时是按需加载的,用则加载,不用则不加载
  24. 像上边的练习,link会首先加载,而active会在指定状态触发时才会加载
  25. */
  26. </style>
  27. </head>
  28. <body>
  29. <a href="javascript:;"></a>
  30. </body>
  31. </html>