我正在为我的网站创建评级栏，我有几个问题 Here is the link for the codepen so you can see what I have so far.
我需要的是为Likes（绿色）和不喜欢（红色）提供两种不同的颜色。我如何将这两者分开并让他们分享吧。 所以有点像youtube的评级栏
和第二个问题
我正在使用Rails（没有回答这个问题所需的专业知识）所以我的代码将是<%= @movies.likes.size %>（即：5000）并且不喜欢<%= @movies.dislikes.size %>（即：3000），使用这样的宽度％的高数字不起作用。
我如何将其按比例调整以适应标准
感谢
答案 0 :(得分：0)
计算喜欢的比例是：
100*likes/(likes+dislikes)
关于第一个问题，为什么不能将.meter-slim的背景颜色设置为红色？
答案 1 :(得分：0)
将.meter-slim的背景颜色更改为您不喜欢的颜色，并将.meter-slim .purple的背景颜色更改为您想要的颜色（示例中为绿色）。
您可能还想在两个地方将该类的名称从紫色更改为其他内容（可能是绿色）。
然后对于百分比（在你的例子中85％），使用100 *喜欢/（喜欢+不喜欢）
修改 我想我会根据下面的评论加入这个。
就像我提到的那样，我只用了几次实验过Ruby，那是十年前的事情，所以我的记忆力很弱。
我将所有内容都放在<%= %>中的想法是基于问题中的代码段。我应该立即提出的更好的方法是为upvotes的百分比创建一个变量（让我们称之为percent_upvotes），然后在你的视图中使用"width: <%= @percent_upvotes %>%"。
因此，您需要计算该值并将其存储在percent_upvotes中。一种方法是在SQL语句中提取upvotes对投票的百分比。我不知道你的架构，但它会像......
SELECT (upvotes/votes) AS percent_upvotes FROM your_table
或者在你的Ruby中......
percent_upvotes = (movies.upvotes.size.to_f / movies.votes.size.to_f ) * 100.0
答案 2 :(得分：0)
一些CSS框架本身包含CSS进度条。
仅举几例：
和一些CSS资源：