svg+css实现炫酷五星打分星级评分点击动画效果代码

代码语言:html

所属分类:星级评分

代码描述:svg+css实现炫酷五星打分星级评分点击动画效果代码

代码标签: svg css 炫酷 五星 打分 星级 评分 点击 动画

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum=1.0,minimum=1.0,user-scalable=0" />
    <title>BFW NEW PAGE</title>

     <style>
     body{
         padding: 100px;
         background: black;
     }
     .rating {
  display: flex;
  flex-direction: row-reverse;
  gap: 0.3rem;
  --stroke: #666;
  --fill: #ffc73a;
}

.rating input {
  appearance: unset;
}

.rating label {
  cursor: pointer;
}

.rating svg {
  width: 2rem;
  height: 2rem;
  overflow: visible;
  fill: transparent;
  stroke: var(--stroke);
  stroke-l.........完整代码请登录后点击上方下载按钮下载查看

网友评论0