html五角星代码css3

HTML五角星代码

	HTML五角星	.star {
      margin: 0 auto;
      position: relative;
      width: 40px;
      height: 40px;
      background-color: #f2b01e;
      -webkit-clip-path: polygon(  	50% 0%, 61% 35%,    98% 35%, 68% 57%,    79% 91%, 50% 70%,    21% 91%, 32% 57%,    2% 35%, 39% 35%);
      clip-path: polygon(  	50% 0%, 61% 35%,    98% 35%, 68% 57%,    79% 91%, 50% 70%,    21% 91%, 32% 57%,    2% 35%, 39% 35%);
}
    		

CSS代码解释

margin: 0 auto; ——将元素居中

position: relative; ——设置元素相对定位

width: 40px; height: 40px; ——设置元素宽度和高度

background-color: #f2b01e; ——设置元素背景颜色

-webkit-clip-path: polygon(...); clip-path: polygon(...); ——设置元素的剪切路径，实现五角星形状

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！