我有一张图片
<img class="user-img" src="user_img/usr.jpg" alt="username" />
并添加 100px 的半径来创建一个圆。
.user-img {
width: 170px;
height: 170px;
-moz-border-radius: 100px;
-webkit-border-radius: 100px;
-khtml-border-radius: 100px ;
border-radius: 100px;
-moz-box-shadow: 0px 10px 10px 0px #999999; /* Firefox */
-webkit-box-shadow: 0px 10px 10px 0px #999999; /* Safari, Chrome */
box-shadow: 0px 10px 10px 0px #999999; /* CSS3 */
}
这工作正常,但后来我添加
border: solid 7px white;
这在 FF 中有效,但在 Chrome 中,边框不遵循圆形 img 的半径。
这是一个演示http://jsfiddle.net/afro360/zcQ3G/2/
建议任何人?
谢谢