Hover 效果在 css 中没有响应
[英]Hover effect not responding in css
问题描述
Hello can someone help me with hover effect in .todo-button:hover I tried a lot of versions but nothing seems to work i mean zero response from a browser:( There must be some mistake in .todo-button construction it seems
您好，有人可以帮我解决.todo-button:hover中的 hover 效果我尝试了很多版本，但似乎没有任何效果，我的意思是浏览器的零响应:( .todo-button构造中一定有一些错误
* { box-sizing: flex-box; margin: 0; padding: 0; font-family: "Trebuchet MS", "Lucida Sans Unicode", "Lucida Grande", "Lucida Sans", Arial, sans-serif; }.todo-button { width: 100px; padding: 16px; border: none; border-radius: 0 4px 4px 0; cursor: pointer; outline: none; background: linear-gradient( 90deg, rgba(93, 12, 255, 1) 0%, rgba(155, 0, 250, 1) 100%); color: #fff; text-transform: capitalize; }.todo-button:hover { background-color: #3e8e41; }
2 个解决方案
解决方案1
2 2021-02-18 19:01:09
In your class you use property background which overwrites the property background-color even it is used in a hover class.在您的 class 中，您使用的属性background会覆盖属性background-color即使它用于 hover class。 Just change hover class to:只需将 hover class 更改为：
.todo-button:hover {
background: #3e8e41;
}
解决方案2
0 2021-02-19 04:36:19
plz try this code请试试这个代码
* { box-sizing: flex-box; margin: 0; padding: 0; font-family: "Trebuchet MS", "Lucida Sans Unicode", "Lucida Grande", "Lucida Sans", Arial, sans-serif; }.todo-button { width: 100px; padding: 16px; border: none; border-radius: 0 4px 4px 0; cursor: pointer; outline: none; background: linear-gradient( 90deg, rgba(93, 12, 255, 1) 0%, rgba(155, 0, 250, 1) 100%); color: #fff; text-transform: capitalize; }.todo-button:hover { background: #3e8e41; }
<,DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width. initial-scale=1.0"> <style> </style> <title>Document</title> </head> <body> <button name="btn" class="todo-button">submit </button> </body> </html>
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.
相关问题
使用CSS创建悬停效果 - create a hover effect with css
CSS悬停按钮效果 - Css hover button effect
在 css 中应用 hover 效果 - Apply hover effect in css
CSS填充为hover效果 - CSS padding as hover effect
使用CSS在悬停效果图像 - Effect image on hover with css
CSS悬停效果烦人吗？ - Css Hover effect bugged?
CSS菜单悬停效果 - CSS Menu hover effect
CSS导航悬停效果 - CSS navigation hover effect
悬停效果的CSS动画 - CSS animation for hover effect
CSS 图像 Hover 效果？ - CSS Image Hover Effect?
相关标签