css3 边框锯齿 |ie8 css hack

.shape {
width: 100px;
height: 100px;
border: 2px solid #000;
position: relative;
}
.shape:before {
content: "";
position: absolute;
top: -5px;
left: -5px;
width: 0;
height: 0;
border-right: 10px solid #000;
border-top: 10px solid #000;
transform: rotate(-45deg);
}

这段代码将会给一个类名为shape的元素添加一个边框。大家使用了伪元素:before来添加一个小三角形，同时使用了transform属性将它旋转了45度。这样就形成了一个锯齿边框的效果。

通过改变伪元素的border属性，大家可以调整锯齿的大小，同时将transform属性的旋转角度修改可以改变锯齿的形态。通过这种方法，大家可以为任意形状的元素添加锯齿边框，使得网页元素更加生动有趣。

不仅仅是锯齿边框，CSS3还有很多强大的样式效果，只要有想象力，大家可以创造出各种各样的视觉效果，让大家的网页变得更加精彩。学习CSS3的技术是非常值得的，它可以大大提高大家的网页设计水平。