【问题标题】:CSS3 transitions not working on buttonCSS3过渡不适用于按钮
【发布时间】:2011-09-26 22:56:37
【问题描述】:

我有一个相对复杂的按钮,我正在使用 CSS3 进行样式设置,它的外观和行为都符合我的预期,除了过渡不起作用。它应该在悬停等时消失,但它只是不工作,在 moz Opera 和 chrome 中测试,没有运气。

这是一个小提琴http://jsfiddle.net/dsyne/DpsuN/1/的链接

任何帮助将不胜感激,我尝试了许多不同的事情。例如重新排序堆栈。我不确定顺序对转换是否重要?

编辑:错误的链接抱歉

【问题讨论】:

    标签: css css-transitions


    【解决方案1】:

    使用 id 来指定转换属性而不是类。为我工作!

    【讨论】:

    • 您的答案可以通过额外的支持信息得到改进。请edit 添加更多详细信息,例如引用或文档,以便其他人可以确认您的答案是正确的。你可以找到更多关于如何写好答案的信息in the help center
    【解决方案2】:

    渐变还不直接支持过渡。您应该定义背景颜色,然后使用跨状态相同的纯 alpha 渐变来添加阴影。

    【讨论】:

    • 你的意思是像这样的纯 alpha:'背景:-moz-linear-gradient(top, rgba(0,102,153,0.8), rgba(0,102,153, 1));'过渡似乎适用于正常状态的渐变,但当我将渐变添加到悬停/焦点/活动状态时则不行。
    • 最终仅使用白色渐变更改 alpha 使其工作。似乎只能在所有状态下使用完全相同的梯度值。还需要注意的是,除非在 CSS 中的渐变下方声明背景颜色,否则它不会起作用。非常感谢您为我指明了正确的方向。
    • 是的,网络开发的乐趣就在边缘! :-)
    猜你喜欢
    • 2017-12-06
    • 1970-01-01
    • 2013-03-03
    • 1970-01-01
    • 2019-03-26
    • 2013-08-06
    • 1970-01-01
    • 1970-01-01
    • 2014-04-01
    相关资源
    最近更新 更多