html - 在创建 CSS 5 星评级时遇到问题

Question

这是我尝试过的。我想要 5 颗星，并将第二颗和随后的星星覆盖在第一颗星上。请帮忙。这是 fiddle http://jsfiddle.net/m3Yw8/1/

<div id="container">
  <div class="star blankstar" id="outer">★</div>
  <div id="inner">
  <div style="width:50%;" class="star goldstar">★</div>
</div>
</div>
/*need 2nd star next to 1st star.*/
<div id="container">
 <div class="star blankstar" id="outer">★</div>
<div id="inner">
   <div style="width:50%;" class="star goldstar">★</div>
</div>
</div>

Answer 1

将内星放在外星内，外星使用position:relative

http://jsfiddle.net/m3Yw8/5/

顺便说一句。如果你有多个类，你应该使用类而不是 id! id 在整个文档中是唯一的。这包括容器、内部和外部