.box { width: 200px; /*设置自己想要的宽度*/ height: 200px; /*设置自己想要的高度*/ border: 1px solid #000; /*添加边框*/ transform: rotate(45deg); /*旋转角度*/ -webkit-transform: rotate(45deg); /*针对webkit内核浏览器*/ -moz-transform: rotate(45deg); /*针对firefox浏览器*/ }
如上代码中,大家给一个class名为”box”的元素添加了边框,并且使用transform属性来实现旋转的效果。其中,rotate()函数用于设置旋转的度数,这里设置的是45度。同时,不同的浏览器内核需要使用不同的前缀来实现兼容性处理。
除了rotate()函数,CSS还提供了translate()函数、scale()函数等来实现更多的变换效果。
总之,CSS的强大之处就在于大家可以通过它来实现各种各样的效果。想要学好CSS,还需要多实践、多尝试。