Javascript 它们如何代表普通电影'；imdb的评级，烂番茄？

好吧，假设一部电影/一家餐馆的平均评级是4.3。在显示页面上，您有对象的名称、描述、联系人、图像等。。。然后你得到了以星星表示的平均评级。在对象的模型中，存储每个用户的评分，并使用简单的数学公式计算平均值。但我好奇的是，它们是如何代表4.3的，即4颗星，略小于4.5？存储50个png图像不是太多了吗？提前谢谢。

实际上比看上去简单多了。想象两个元素堆叠在一起：

一排金星

一排灰色的星星

然后，使用一个简单的图像掩码，您可以在

js

中计算

金星

层的相对宽度

更详细地说，他们实际上使用精灵作为基础：

播放宽度值，您将看到完整效果：

document.querySelector（“.one.gold”）.style.width=“83.5%”；
document.querySelector（“.two.gold”）.style.width=“56%”
div{位置：相对；高度：12px；边距底部：10px；宽度：140px；
背景：url（'http://ia.media-imdb.com/images/G/01/imdb/images/rating/rating-list/sprite-1445387679._V_.png'）0-28px；
}
跨度{
位置：绝对位置；
排名：0；
左：0；
高度：12px；
背景图像：url（'http://ia.media-imdb.com/images/G/01/imdb/images/rating/rating-list/sprite-1445387679._V_.png');
}
.gold{背景位置：0-42px；}

欢迎来到SO。请先到，然后阅读并提供答案。如果周围的人能帮忙，他们会的。但是请记住，这样的社区是有帮助的，没有人会为你做所有的工作。到目前为止你试过什么？。。。已经有很多片段可以满足你的需要了，你搜索过吗？一颗星就足够了。