css3 实现星级选择

代码语言:html

所属分类:星级评分

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

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">

    <title> - Tiny but accessible 5 star rating</title>
    <style>
@charset "UTF-8";
:root {
        --star-size: 60px;
        --star-color: #fff;
        --star-background: #fc0;
    }

        .Stars {
            --percent: calc(var(--rating) /5 * 100%);
            display: inline-block;
            font-size: var(--star-size);
            font-family: Times;
            line-height: 1;
        }
        .Stars::before {
            content: '★★★★★';
            letter-spacing: 3px;
            background: linear-gradient(90deg, var.........完整代码请登录后点击上方下载按钮下载查看

网友评论0