边框HTML TABLE 窄边框 样式技巧

HTMLTABLE窄边框样式技巧

TABLE边线设置最低只能是1 px 1px的实际效果是非常粗的缺乏美感。我可以利用CSS技巧做错非常细的边框细线边框看起来非常具有美感。

<html>

<head>

<style type="text/css">table{border-collapse:collapse;border-spacing:0;border-left: 1px solid #888;border-top: 1px solid #888;background:#efefef; }th, td{border-right: 1px solid #888;border-bottom: 1px solid #888;padding:5px 15px; }th{font-weight:bold;background:#ccc; }

</style>

<body>

<table>

<tr><td>姓名</td><td>性别</td><td>年龄</td></tr>

<tr><td>张三</td><td>男</td><td>18</td></tr>

<tr><td>李四</td><td>男</td><td>17</td></tr>

<tr><td>谢楠</td><td>女</td><td>18</td></tr>

<tr><td>李娜娜/td><td>女</td><td>14</td></tr></table>

</body>