我在按钮标记中的过渡 css 属性方面遇到问题。
当我悬停按钮时,我以为它会平滑地转到 width:auto,但它直接跳转。
这是代码,我错过了什么?
<button>Hello</button>
button {
padding: 10px;
width: 30px;
overflow:hidden;
transition: width 400ms ease-in-out;
-webkit-transition: width 400ms ease-in-out;
-moz-transition: width 400ms ease-in-out;
}
button:hover {
width: auto;
}
最佳答案
最大宽度是你的 friend
button {
padding: 10px;
width: auto;
max-width: 30px;
overflow:hidden;
transition: max-width 400ms ease-in-out;
-webkit-transition: max-width 400ms ease-in-out;
-moz-transition: max-width 400ms ease-in-out;
}
button:hover {
max-width: 100%;
}
关于css - 按钮宽度CSS过渡不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32213845/