0

试图让 CSS3 箭头在 webkit 浏览器中工作,但我想我错过了一些东西,代码在 Firefox 中工作。

<div class="box">
    <h3>Box Inside</h3>
</div>​

.box {
    padding: 20px;
    border: 2px solid #DDDDDD;
    width: 150px;
    text-align: center;
    position:relative;
}

.box:after {
    background: none repeat scroll 0 0 #FFFFFF;
    border-color: transparent transparent transparent #fff;
    border-style: solid;
    border-width: 9px;
    content: "";
    display: block;
    height: 0;
    position: absolute;
    right: -12%;
    top: 10px;
    width: 0;

}​</p>

示例:http: //jsfiddle.net/fJkH8/

4

1 回答 1

1

试试这个,这适用于 Firefox 和 chrome: http ://cssarrowplease.com/

于 2012-12-20T13:34:20.060 回答