前端项目小练习:CSS创建3D圆柱旋转效果
💖💖💖💕💕💕欢迎来到本博客💕💕💕💖💖💖
🎁支持:如果觉得博主的文章写得还说得过去或者博客对您有帮助的话,可以关注一下博主,如果三连收藏支持就更好啦!这就是给予我最大的支持!
🎉🎉Welcome to my blog!🎉🎉
📃个人CSDN博客主页:热爱科技的刘同学🌈🌈🌈
学习css,我们必须模仿圆柱体,因为我们没有用于圆形物体的css原生盒子。
就我自己的想法而言,我将添加很多我们彼此倾斜的侧面板。这将模仿我们正在寻找的 3D 效果。
HTML标记
我选择在 Pug
中进行演示。模拟 HTML
很容易,因为它可以使用变量。
但是,归结为以下 HTML
输出。
<div class="holder">
<div class="cylinder">
<div class="face" style