CSS是一种强大的前端语言,它可以通过修改HTML和XML文档的样式来控制网页的呈现方式。而今天我们要介绍的是CSS一个点变成一本书。 .point-to-book { width: 100px; h
CSS是一种强大的前端语言,它可以通过修改HTML和XML文档的样式来控制网页的呈现方式。而今天我们要介绍的是CSS一个点变成一本书。
.point-to-book { width: 100px; height: 100px; border: 5px solid #333; border-radius: 50%; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); transform: rotate(-45deg); background: linear-gradient(45deg, #333 25%, transparent 25%, transparent 50%, #333 50%, #333 75%, transparent 75%, transparent); background-size: 10px 10px; }
代码中的.point-to-book就是我们要操作的点,通过CSS的transform属性将其旋转45度,再通过background属性与background-size属性来实现对点进行了处理后的样式。
效果如下:
如此一个小小的点就变成了一本书的造型,这就是CSS的奇妙之处。
粉丝
0
关注
0
收藏
0