初次评价页面样式调整

src/main/webapp/resources/view/usercenter/forstore/first_rate.html

@@ -30,26 +30,37 @@
         font-size: 14px;
         margin-left: 15px;
     }
+    .first-rate table tbody tr {
+        border-bottom: 1px dashed rgb( 232, 235, 252 );
+    }
     .first-rate table tbody tr td img{
         width: 73px;
         height: 74px;
         float: left;
+        margin-top: 12px;
     }
     .first-rate table tbody tr td .first-rate-item-info {
         display: inline-block;
         width: 200px;
         float: left;
+        margin-top: 15px;
     }
     .first-rate table tbody tr td .first-rate-item-introduce {
         display: block;
-        margin: 5px 10px;
+        margin: 0px 10px;
         font-size: 14px;
     }
     .first-rate table tbody tr td .first-rate-item-introduce span {
+        float: left;
+    }
+    .first-rate table tbody tr td .first-rate-item-introduce span.first-rate-item-link {
         max-width: 130px;
         overflow: hidden;
         text-overflow: ellipsis;
         display: inline-block;
+        white-space: nowrap;
+        height: 22px;
+        line-height: 22px;
     }
     .first-rate table tbody tr td .first-rate-item-rate {
         display: inline-block;
@@ -58,8 +69,7 @@
     .first-rate table tbody tr td .first-rate-item-rate .rate-item {
         display: inline-block;
         margin-right: 10px;
-        position: relative;
-        top: 8px;
+        margin-top: 6px;
         font-size: 14px;
     }
     .first-rate table tbody tr td .first-rate-item-rate .rate-item label {
@@ -72,13 +82,35 @@
         float: right;
         background: #f5f8ff;
         padding: 7px 15px;
-        margin-top: 5px;
+        margin: 5px 0;
     }
     .first-rate table tbody tr td .first-rate-item-textBox textarea {
         width: 507px;
         height: 87px;
         overflow: scroll;
     }
+    .first-rate table tbody .record-num {
+        border: none;
+    }
+    .first-rate table tbody .record-num td .count-tip{
+        float: right;
+        margin-right: 10px;
+    }
+    .first-rate .submitBox {
+        text-align: center;
+        margin: 35px auto;
+    }
+    .first-rate .submitBox label {
+        font-size: 14px;
+        font-weight: normal;
+        margin-right: 22px;
+    }
+    .first-rate .submitBox >span {
+        font-size: 14px;
+        padding: 4px 17px;
+        background: #5078cb;
+        color: #fff;
+    }
 
 </style>
 
@@ -112,9 +144,38 @@
                 <td>
                     <img src="static/img/user/images/default.png" alt="">
                     <div class="first-rate-item-info">
-                        <span class="first-rate-item-introduce">类目：<span>专用处理器</span></span>
-                        <span class="first-rate-item-introduce">型号：<span>445NNSJASDASKDJA</span></span>
-                        <span class="first-rate-item-introduce">品牌：<span>mnnnnnk</span></span>
+                        <span class="first-rate-item-introduce"><span class="first-rate-item-link">类目：专用处理器</span></span>
+                        <span class="first-rate-item-introduce"><span class="first-rate-item-link">型号：445NNSJASDASKDJA</span></span>
+                        <span class="first-rate-item-introduce"><span class="first-rate-item-link">品牌：mnnnnnk</span></span>
+                    </div>
+                    <div class="first-rate-item-rate">
+                        <div class="rate-item">
+                            <label for="1">
+                                <span>好评</span>
+                                <input type="radio" id="1">
+                            </label>
+                            <label for="2">
+                                <span>中评</span>
+                                <input type="radio" id="2">
+                            </label>
+                            <label for="3">
+                                <span>差评</span>
+                                <input type="radio" id="3">
+                            </label>
+                        </div>
+                        <div class="first-rate-item-textBox">
+                            <textarea placeholder="请输入您对产品的评价" name="" id="" cols="30" rows="10"></textarea>
+                        </div>
+                    </div>
+                </td>
+            </tr>
+            <tr>
+                <td>
+                    <img src="static/img/user/images/default.png" alt="">
+                    <div class="first-rate-item-info">
+                        <span class="first-rate-item-introduce"><span class="first-rate-item-link">类目：专用处理器</span></span>
+                        <span class="first-rate-item-introduce"><span class="first-rate-item-link">型号：445NNSJASDASKDJA</span></span>
+                        <span class="first-rate-item-introduce"><span class="first-rate-item-link">品牌：mnnnnnk</span></span>
                     </div>
                     <div class="first-rate-item-rate">
                         <div class="rate-item">
@@ -137,6 +198,134 @@
                     </div>
                 </td>
             </tr>
+            <tr>
+                <td>
+                    <img src="static/img/user/images/default.png" alt="">
+                    <div class="first-rate-item-info">
+                        <span class="first-rate-item-introduce"><span class="first-rate-item-link">类目：专用处理器</span></span>
+                        <span class="first-rate-item-introduce"><span class="first-rate-item-link">型号：445NNSJASDASKDJA</span></span>
+                        <span class="first-rate-item-introduce"><span class="first-rate-item-link">品牌：mnnnnnk</span></span>
+                    </div>
+                    <div class="first-rate-item-rate">
+                        <div class="rate-item">
+                            <label for="1">
+                                <span>好评</span>
+                                <input type="radio" id="1">
+                            </label>
+                            <label for="2">
+                                <span>中评</span>
+                                <input type="radio" id="2">
+                            </label>
+                            <label for="3">
+                                <span>差评</span>
+                                <input type="radio" id="3">
+                            </label>
+                        </div>
+                        <div class="first-rate-item-textBox">
+                            <textarea placeholder="请输入您对产品的评价" name="" id="" cols="30" rows="10"></textarea>
+                        </div>
+                    </div>
+                </td>
+            </tr>
+            <tr>
+                <td>
+                    <img src="static/img/user/images/default.png" alt="">
+                    <div class="first-rate-item-info">
+                        <span class="first-rate-item-introduce"><span class="first-rate-item-link">类目：专用处理器</span></span>
+                        <span class="first-rate-item-introduce"><span class="first-rate-item-link">型号：445NNSJASDASKDJA</span></span>
+                        <span class="first-rate-item-introduce"><span class="first-rate-item-link">品牌：mnnnnnk</span></span>
+                    </div>
+                    <div class="first-rate-item-rate">
+                        <div class="rate-item">
+                            <label for="1">
+                                <span>好评</span>
+                                <input type="radio" id="1">
+                            </label>
+                            <label for="2">
+                                <span>中评</span>
+                                <input type="radio" id="2">
+                            </label>
+                            <label for="3">
+                                <span>差评</span>
+                                <input type="radio" id="3">
+                            </label>
+                        </div>
+                        <div class="first-rate-item-textBox">
+                            <textarea placeholder="请输入您对产品的评价" name="" id="" cols="30" rows="10"></textarea>
+                        </div>
+                    </div>
+                </td>
+            </tr>
+            <tr>
+                <td>
+                    <img src="static/img/user/images/default.png" alt="">
+                    <div class="first-rate-item-info">
+                        <span class="first-rate-item-introduce"><span class="first-rate-item-link">类目：专用处理器</span></span>
+                        <span class="first-rate-item-introduce"><span class="first-rate-item-link">型号：445NNSJASDASKDJA</span></span>
+                        <span class="first-rate-item-introduce"><span class="first-rate-item-link">品牌：mnnnnnk</span></span>
+                    </div>
+                    <div class="first-rate-item-rate">
+                        <div class="rate-item">
+                            <label for="1">
+                                <span>好评</span>
+                                <input type="radio" id="1">
+                            </label>
+                            <label for="2">
+                                <span>中评</span>
+                                <input type="radio" id="2">
+                            </label>
+                            <label for="3">
+                                <span>差评</span>
+                                <input type="radio" id="3">
+                            </label>
+                        </div>
+                        <div class="first-rate-item-textBox">
+                            <textarea placeholder="请输入您对产品的评价" name="" id="" cols="30" rows="10"></textarea>
+                        </div>
+                    </div>
+                </td>
+            </tr>
+            <tr>
+                <td>
+                    <img src="static/img/user/images/default.png" alt="">
+                    <div class="first-rate-item-info">
+                        <span class="first-rate-item-introduce"><span class="first-rate-item-link">类目：专用处理器</span></span>
+                        <span class="first-rate-item-introduce"><span class="first-rate-item-link">型号：445NNSJASDASKDJA</span></span>
+                        <span class="first-rate-item-introduce"><span class="first-rate-item-link">品牌：mnnnnnk</span></span>
+                    </div>
+                    <div class="first-rate-item-rate">
+                        <div class="rate-item">
+                            <label for="1">
+                                <span>好评</span>
+                                <input type="radio" id="1">
+                            </label>
+                            <label for="2">
+                                <span>中评</span>
+                                <input type="radio" id="2">
+                            </label>
+                            <label for="3">
+                                <span>差评</span>
+                                <input type="radio" id="3">
+                            </label>
+                        </div>
+                        <div class="first-rate-item-textBox">
+                            <textarea placeholder="请输入您对产品的评价" name="" id="" cols="30" rows="10"></textarea>
+                        </div>
+                    </div>
+                </td>
+            </tr>
+            <tr class="record-num">
+                <td colspan="6">
+                    <span class="count-tip">显示<span ng-bind="$$kdnData.start">23</span>-<span ng-bind="$$kdnData.end">10</span>，共：<span ng-bind="$$kdnData.totalElements" style="color: #5078cb;">23</span>个</span>
+                </td>
+            </tr>
         </tbody>
     </table>
+    <div class="submitBox">
+        <label for="a">
+            <input type="checkbox" id="a">
+            <span>匿名评价</span>
+        </label>
+        <span>提交</span>
+    </div>
 </div>