锚定造型有问题

Question

我的造型完成如下

/*------------this css is an internal css in the html page-------------*/

<style>
.rating_star
  {
      background-image: url('<?php echo base_url();?>assets/front_assets/images/star_hv.gif');
  }

.rating_star hover
  {
      background-image: url('<?php echo base_url();?>assets/front_assets/images/star.gif');
  }
</style>

这是HTML部分：

<a href="javascript:void(0);" onclick="
        var i='<?php echo base_url();?>assets/front_assets/images/loading.gif';
        var load = document.createElement('img');
        load.setAttribute('src', i);

        $('#rate').html(load);
        $.post('<?php echo base_url();?>rating/rate'
             {'star':1,'item_slug':$('#item_slug').val()},
               function(data){$('#rate').html(data););" class="rating_star">&nbsp;
</a> 

问题是我看不到任何图像，即使我将鼠标悬停在href上，我也看不到任何变化。