update

Author: 黄书伟

packages/themes-base/v-table.css

@@ -106,44 +106,55 @@
     border-width: 0;
     border-style: solid;
     border-color: rgba(221, 221, 221, 1);
+}
 
+.v-table-title-cell:before {
+    content: '';
+    display: inline-block;
+    height: 100%;
+    vertical-align: middle;
+    /* border: 1px solid red;*/ /* so we can see what's going on */
 }
 
 .table-title{
     display: inline-block;
     padding:0 3px;
+    vertical-align: middle;
     word-break: break-all;
     overflow: hidden;
+    line-height: 1.2em;
 }
 
 .v-table-sort-icon {
     position: relative;
     display: inline-block;
-    width: 14px;
     vertical-align: middle;
-    text-align: center;
-    height: 100%;
-    line-height: 100%;
-    cursor: pointer;
+    /*font-size:16px;*/
+    width:16px;
+    height: 19px;
     margin-left: -8px;
+    overflow: hidden;
+    cursor: pointer;
 }
 
 .v-table-sort-icon i {
+
     position: absolute;
-    line-height: 8px;
     display: block;
-    width: 14px;
-    height: 8px;
+    width:16px;
+    height: 15px;
+    /*line-height: 12px;*/
+    overflow: hidden;
     color: #a6a6a6;
     transition: color .2s ease-in-out;
 }
 
 .v-table-sort-icon i:first-child {
-    top: -10px;
+    top: -4px;
 }
 
 .v-table-sort-icon i:last-child {
-    /*   bottom: 10px;*/
+    bottom: -0px;
 }
 
 .v-table-header .cursorPointer{

packages/v-table/src/table.vue

@@ -19,7 +19,7 @@
                                         @mousedown.stop="handleTitleMouseDown($event)"
                                         @mouseout.stop="handleTitleMouseOut()">
                                         <div :class="['v-table-title-cell',showVerticalBorder?'vertical-border':'',showHorizontalBorder?'horizontal-border':'']"
-                                             :style="{'width':titleColumnWidth(col.fields)+'px','height':titleColumnHeight(col.rowspan)+'px','line-height':titleColumnHeight(col.rowspan)+'px','text-align':col.titleAlign}">
+                                             :style="{'width':titleColumnWidth(col.fields)+'px','height':titleColumnHeight(col.rowspan)+'px','text-align':col.titleAlign}">
                                             <span class="table-title" v-html="col.title"></span>
                                             <span @click.stop="sortControl(col.fields[0],col.orderBy)" class="v-table-sort-icon" v-if="enableSort(col.orderBy)">
                                                     <i :class='["v-icon-up-dir",col.orderBy ==="asc" ? "checked":""]'></i>
@@ -38,7 +38,7 @@
                                         @mousedown.stop="handleTitleMouseDown($event)"
                                         @mouseout.stop="handleTitleMouseOut()">
                                         <div :class="['v-table-title-cell',showVerticalBorder?'vertical-border':'',showHorizontalBorder?'horizontal-border':'']"
-                                             :style="{'width':col.width+'px','height':titleRowHeight+'px','line-height':titleColumnHeight(col.rowspan)+'px','text-align':col.titleAlign}">
+                                             :style="{'width':col.width+'px','height':titleRowHeight+'px','text-align':col.titleAlign}">
                                             <span class="table-title" v-html="col.title"></span>
                                             <span @click.stop="sortControl(col.field,col.orderBy)" class="v-table-sort-icon" v-if="enableSort(col.orderBy)">
                                                     <i :class='["v-icon-up-dir",col.orderBy ==="asc" ? "checked":""]'></i>
@@ -111,7 +111,7 @@
                                     @mousedown.stop="handleTitleMouseDown($event)"
                                     @mouseout.stop="handleTitleMouseOut()">
                                     <div :class="['v-table-title-cell',showVerticalBorder?'vertical-border':'',showHorizontalBorder?'horizontal-border':'']"
-                                         :style="{'width':titleColumnWidth(col.fields)+'px','height':titleColumnHeight(col.rowspan)+'px','line-height':titleColumnHeight(col.rowspan)+'px','line-height':titleColumnHeight(col.rowspan)+'px','text-align':col.titleAlign}">
+                                         :style="{'width':titleColumnWidth(col.fields)+'px','height':titleColumnHeight(col.rowspan)+'px','text-align':col.titleAlign}">
                                         <span class="table-title" v-html="col.title"></span>
                                         <span @click.stop="sortControl(col.fields[0],col.orderBy)" class="v-table-sort-icon" v-if="enableSort(col.orderBy)">
                                                     <i :class='["v-icon-up-dir",col.orderBy ==="asc" ? "checked":""]'></i>
@@ -131,7 +131,7 @@
                                     @mousedown.stop="handleTitleMouseDown($event)"
                                     @mouseout.stop="handleTitleMouseOut()">
                                     <div :class="['v-table-title-cell',showVerticalBorder?'vertical-border':'',showHorizontalBorder?'horizontal-border':'']"
-                                         :style="{'width':col.width+'px','height':titleRowHeight+'px','line-height':titleColumnHeight(col.rowspan)+'px','text-align':col.titleAlign}">
+                                         :style="{'width':col.width+'px','height':titleRowHeight+'px','text-align':col.titleAlign}">
                                         <span class="table-title" v-html="col.title"></span>
                                         <span @click.stop="sortControl(col.field,col.orderBy)" class="v-table-sort-icon" v-if="enableSort(col.orderBy)">
                                                     <i :class='["v-icon-up-dir",col.orderBy ==="asc" ? "checked":""]'></i>