基于BootStrap仿淘宝星星商品评价案例_bootstrap 商品评论-优快云博客

本博客通过BootStrap展示了如何模仿淘宝网站上的星星评价系统，详细讲解了实现这一功能的过程和关键代码。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <title>基于BootStrap的仿淘宝星星商品评价案例</title>
    <link rel="stylesheet" href="http://v3.bootcss.com/dist/css/bootstrap.min.css" />
    <script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
    <style>
        /* 向左的箭头 */  
        .glyphicon{
            cursor: pointer;
        }
        .dot-left {  
            font-size: 0;  
            line-height: 0;  
            border-width: 5px;  
            border-color: #f37a0e;  
            border-left-width: 0;  
            border-style: dashed;  
            border-right-style: solid;  
            border-top-color: transparent;  
            border-bottom-color: transparent;  
            display: inline-block;
        } 
        /* 文字提示框 */
        .tip{
            background: #f37a0e;
            padding: 0 5px;
            display: inline-block;
            border-radius: 5px;
        }
    </style>
</head>
<body>
    <div class="container">
        <table class="table table-bordered table-hover table-striped table-condensed">
            <tr>
                <td colspan='3'>
                    <h2>基于BootStrap的仿淘宝星星商品评价案例</h2>
                </td>
            </tr>
            <tr>
                <th width="33%">评价项目</th>
                <th width="33%">星星</th>
                <th width="33%">分数</th>
            </tr>
            <tr class="tr">
                <td>描述相符</td>
                <td>
                    &