CSS实例教程:CSS制作星级评价的功能

作者佚名技术来源 CSS技术浏览发布时间 2012-02-26

做一个星级评价的功能不是很难，但是要单纯用CSS写估计就有点难度了，先来个截图：

效果很简单，可能现在您现在脑子里已经有实现的思路了。下面先看一下我们通常情况下的实现方法：

CSS：

以下为引用的内容：

          .jsstar
        {   list-style: none;
            margin: 0px;
            padding: 0px;
            width: 100px;
            height: 20px;
            position: relative;

            }
         .jsstar li
         {
            padding:0px;
            margin: 0px;
            float: left;
            width:20px;
            height:20px;
            background:url(star_rating.gif) 0 0 no-repeat;
            }

HTML：

以下为引用的内容：

<p>Javascript + CSS实现</p>
<ul class="jsstar">
    <li title="一星"></li>
    <li title="二星"></li>
    <li title="三星"></li>
    <li title="四星"></li>
    <li title="五星"></li>
</ul>

凌众科技专业提供服务器租用、服务器托管、企业邮局、虚拟主机等服务，公司网站：http://www.lingzhong.cn 为了给广大客户了解更多的技术信息，本技术文章收集来源于网络,凌众科技尊重文章作者的版权，如果有涉及你的版权有必要删除你的文章，请和我们联系。以上信息与文章正文是不可分割的一部分,如果您要转载本文章,请保留以上信息，谢谢!

1 2 3 下一页

分享到：更多

你可能对下面的文章感兴趣

上一篇: 总结学习web标准的十个重要理由下一篇: CSS实例教程:纯CSS实现圆角框

关于CSS实例教程:CSS制作星级评价的功能的所有评论

随机推荐