前端开发表格边界线，表格过长显示滚动条及样式设置

表格table边界线及表格内线条设置

<table border="1" style="border: 1px solid rgba(67, 153, 216, 0.3);border-collapse:collapse;"></table>
设定元素的边框为1像素宽，实线，颜色使用rgba来表达。(a为透明度)
border-collapse:collapse;表示如果可能，边框会合并为一个单一的边框。会忽略 border-spacing 和 empty-cells 属性。

表格过长，显示滚动条并设置滚动条样式

<div class="test-1" id="myRealTable"> <table border="1" style="border: 1px solid rgba(67, 153, 216, 0.3);border-collapse:collapse;"></table>
样式如下：

`.test-1::-webkit-scrollbar {/滚动条整体样式/
width: 5px; /高宽分别对应横竖滚动条的尺寸/
height: 1px;
}

.test-1::-webkit-scrollbar-thumb {/滚动条里面小方块/
border-radius: 3px;
-webkit-box-shadow: inset 0 0 5px rgba(35,88,127,0.2);
background: #23587f;
}

.test-1::-webkit-scrollbar-track {/滚动条里面轨道/
-webkit-box-shadow: inset 0 0 5px rgba(20,53,76,0.2);
border-radius: 1px;
background: #14354c;
}`