html - css3按钮中的问题

我正在尝试基于ipad创建一个后退按钮。
我有一个按钮和箭头，似乎无法减小箭头的高度以与按钮匹配。如果我减小箭头的高度，它将无法正确显示。

感谢sandeep的箭头样式。

这是我到目前为止所做的代码
http://jsfiddle.net/dVbJr/5/

最佳答案

您可以通过此CSS轻松实现：-

.arrow:after{
    -moz-transform: rotate(45deg);
    background: none repeat scroll 0 0 #F4F4F4;
    border: 1px solid #999999;
    border-radius: 10px 10px 10px 10px;
    content: "";
    height: 75px;
    position: absolute;
    right: -53px;
    top: -33px;
    width: 45px;
}

参见演示：-http://jsfiddle.net/dVbJr/11/

更新

请使用以下命令更新您的CSS：

    .arrow:after{
     -moz-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    background: none repeat scroll 0 0 #F4F4F4;
    border: 1px solid #999999;
    border-radius: 10px 10px 10px 10px;
    content: "";
    height: 75px;
    position: absolute;
    right: -53px;
    top: -33px;
    width: 45px;
}

现在可以使用的网络工具包浏览器...

有关基于纯css的形状的更多信息，请阅读本文：-http://www.css3shapes.com/

关于html - css3按钮中的问题，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/10683553/