输入按钮使用滑动门CSS

专门为输入按钮如<input type="submit" value="Button Name">设计，此圆形键式使用该真实从单个图像组装sliding doors技术。输入按钮使用滑动门CSS

演示：Click to review the source code and demo the code in action
演示：Click to see a video demo of the style in Mac browsers: Firefox, Safari, Chrome and Opera

此按钮样式启用以下：

解析宽按钮问题为IE浏览器长期按钮名称。
解决与IE浏览器的一个问题，当右滑门片会漂浮在页面上，当按钮被隐藏服务器端。
向下滚动时再备份页面解析为IE浏览器零散的文本问题。
这是设计师的完美替代品，当你不能使用的ASP 净按钮控件，如 <asp:Button id="b1" Text="Submit" runat="server" />在你的代码
交叉兼容 Safari浏览器，IE，火狐，Chrome和歌剧。 watch video

来源

2010-06-29 Evan

我想你只需要改变一个伪类。

span.button input.form_button:hover { 
    background-position:left -39px; 
    color:#FFFFFF; 
}

应该

span.button:hover input.form_button { 
    background-position:left -39px; 
    color:#FFFFFF; 
}

编辑：这是行的演示源

来源

2010-06-29 14:01:42

你解决了它的52！另外，我根据你的建议添加了这个，所以当点击右端时，它也会正确地激活左侧。谢谢瑞恩！我现在有一个完成的按钮！ span.button：活性input.form_button { 背景位置：左-78px; color：#FFFFFF; } – Evan 2010-06-29 14:06:39

总是很高兴提供帮助！ – 2010-06-29 14:11:23

输入按钮使用滑动门CSS

回答

相关问题