css实现带数字分值显示星级评分效果代码

代码语言:html

所属分类:星级评分

代码描述:css实现带数字分值显示星级评分效果代码

代码标签: css 数字 分值 显示 星级 评分

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

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">




    <style>
        body {
        	margin: 0;
        	width: 100vw;
        	height: 100vh;
        	display: flex;
        	align-items: center;
        	justify-content: center;
        	background-color: #11114e;
        	background: radial-gradient( circle at 50% 100%, #1d659f, #11114e);	
        }
        
        body * {
            box-sizing: border-box;
        }
        
        .rating-stars {
        	display: block;
        	width: 50vmin;
        	padding: 1.75vmin 10vmin 2vmin 3vmin;
        	background: linear-gradient(90deg, #ffffff90 40vmin, #fff0 40vmin 100%);
        	border-radius: 5vmin;
        	position: relative;
        }
        
        .rating-counter {
        	font-size: 5.5vmin;
            font-family: Arial, Helvetica, serif;
            color: #9aacc6;
            width: 10vmin;
            text-align: center;
            background: #0006;
            position: absol.........完整代码请登录后点击上方下载按钮下载查看

网友评论0