按钮带颜色加超级链接代码

china0396

按钮带颜色加超级链接代码

#007bff代表颜色自行更换
1

1. <style>
   
2. .btn-link {
   
3.   padding: 10px 20px;
   
4.   background-color: #007bff;
   
5.   color: white;
   
6.   text-decoration: none;
   
7.   border-radius: 5px;
   
8.   transition: background-color 0.3s;
   
9. }
   
10. .btn-link:hover {
    
11.   background-color: #0056b3;
    
12. }
    
13. </style>
    
14. <a href="网址" class="btn-link">按钮文字</a>

复制代码

2

1. <style>
   
2. 
   
3. 
   
4. 
   
5. .btn-link {
   
6. 
   
7. 
   
8. 
   
9.   display: inline-block;
   
10. 
    
11. 
    
12. 
    
13.   padding: 15px 30px;
    
14. 
    
15. 
    
16. 
    
17.   background-color: #007bff;
    
18. 
    
19. 
    
20. 
    
21.   color: white;
    
22. 
    
23. 
    
24. 
    
25.   text-decoration: none;
    
26. 
    
27. 
    
28. 
    
29.   border-radius: 8px;
    
30. 
    
31. 
    
32. 
    
33.   font-size: 18px;
    
34. 
    
35. 
    
36. 
    
37. }
    
38. 
    
39. 
    
40. 
    
41. </style>
    
42. 
    
43. 
    
44. 
    
45. <a href="网址" class="btn-link">点击这里</a>
    
46. 
    

复制代码