最近刚学习了CSS转换,想让自己掌握的更牢固一些,所以准备用CSS来做一面国旗。
也在这个特殊时期,愿早日战胜疫情,中国加油!!
第一步:搭建出HTML结构。
第二步:写出旗面样式。
定位作为子元素参考第三步:先创建出三角星。(众所周知三个三角星可以组成五角星)
使三边不可见可实现三角星第四步:用伪元素给前后插入两个新的三角星。
第四步:控制伪元素位置。
用定位和旋转让三个三角星组成五角星第五步:用定位把做好的五角星放到合适的位置并加以旋转和缩放达到预期效果。
完成。
效果如图中国加油!我们一定可以!
网友评论