在CSS中，分数通常是通过伪元素和CSS选择器来实现的。以下是一个简单的示例，展示如何在一个评分组件中创建分数：

HTML结构

```html

```

CSS样式

```css

.star-box {

position: relative；

width: 100px； /* 或者其他你希望的宽度 */

height: 20px； /* 或者其他你希望的高度 */

}

.star-box label {

float: right；

color: 999；

cursor: pointer；

}

.star-box label::after {

content: ''；

font-size: 28px；

padding: 5px；

display: inline-block；

line-height: 1；

}

.star-box input:checked ~ label,

.star-box label:hover ~ label,

.star-box label:hover {

color: red；

}

```

在这个示例中：

`.star-box` 是评分组件的容器。

`.star-box label` 是每个星星的标签，初始颜色为灰色。

`.star-box label::after` 是伪元素，用于显示星星的图标。

`.star-box input:checked ~ label` 选择器用于当对应的单选按钮被选中时，将标签的颜色改为红色。

`.star-box label:hover ~ label` 和 `.star-box label:hover` 选择器用于当鼠标悬停在星星上时，将标签的颜色改为红色。

你可以根据需要调整样式，例如改变星星的大小、颜色等。这个示例提供了一个基本的评分组件，你可以在此基础上进行扩展和定制。