我創造了我的網站評級酒吧和我有幾個問題 Here is the link for the codepen so you can see what I have so far.評級酒吧CSS
我需要的是有兩個不同顏色的喜好（綠色）和不喜歡的（紅色）。我如何分開這兩個並讓他們分享吧。 所以有點像YouTube的評價吧
和第二個問題
我使用Rails（沒有回答這個問題，需要軌道的專業知識），所以我對喜歡的代碼將<%= @movies.likes.size %>（即：5000）和厭惡<%= @movies.dislikes.size %>（即：3000），使用這樣一個高數字的寬度％不會工作。 我怎麼能proportionalize它適合酒吧 感謝
要計算喜好的比例是：
100*likes/(likes+dislikes)
關於第一個問題，爲什麼不能你剛纔設置的背景顏色。米瘦是紅色的例子？
將.meter-slim的背景顏色更改爲您想要的顏色，並將.meter-slim.purple的背景顏色更改爲您喜歡的顏色（在您的示例中爲綠色）。
您可能還想將該類的名稱從紫色改爲其他地方（綠色也許）。
那麼對於百分比（其中85％是在你的例子），使用100 *喜歡/（喜歡+惡）
編輯： 我以爲我會添加到這個基礎上我們下面的評論。
就像我剛纔提到的，我只用了幾次Ruby就進行了實驗，那是十年前的事情，所以我的記憶力很弱。
我的想法是將所有內容都放在<%= %>中，這是基於您在問題中的片段。我應該立即提出的一種更好的方法是爲upvotes的百分比創建一個變量（讓我們將其稱爲percent_upvotes），然後在您的視圖中使用"width: <%= @percent_upvotes %>%"。
因此，您需要計算該值並將其存儲在percent_upvotes中。一種方法是在你的SQL語句中提取投票的百分比。我不知道你的方案，但它會是這樣......
SELECT (upvotes/votes) AS percent_upvotes FROM your_table
或者在你的Ruby ...
percent_upvotes = (movies.upvotes.size.to_f/movies.votes.size.to_f) * 100.0
一些CSS框架包含CSS進度條本身。
僅舉幾例：
和一些CSS資源：
因爲，說有一個喜歡和不喜歡0 這將是1個％喜歡和0％不喜歡，所以大部分的酒吧將是紅色的，在那裏，它應該是綠色的，這是另一個問題 – PMP
@ PMP - 在這種情況下，酒吧會100％喜歡和0％不喜歡。 –
哦，不，因爲我使用'width'，和我的Rails代碼（這顯示喜歡的數量）將是一個號碼，如果有喜歡的話會顯示1％而不是100％ – PMP