私はheadcellでダブルボーダーを追加しようとしていますが、背景イメージを使用しないと難しいと感じています。出来ますか?HTMLテーブルのボーダートップ2 px
私は白い色のボーダートップを持っていますが、私は白の上にグレーの色が欲しいです。だから、ボーダートップのcccやfffのようなものです。
マイHTML & CSS:
私はCSSでそれを行うことができることを知ってtable.hor-zebra {
width: 100%;
text-align: left;
border-collapse: collapse;
border: #cccccc 1px solid;
}
table.hor-zebra>thead {
border-top: #cccccc 1px solid;
}
table.hor-zebra>thead>tr>th {
background: #e2e2e2;
border-top: #ffffff 1px solid;
border-bottom: #cccccc 1px solid;
padding: 4px;
color: #000;
}
table.hor-zebra>tbody>tr>td {
background: #f3f3f3;
border-bottom: #cccccc 1px solid;
padding: 8px 4px 8px 4px;
}
table.hor-zebra>tbody>tr>td.odd {
background: #f8f8f8;
border-bottom: #cccccc 1px solid;
}
table.hor-zebra>tbody>tr:hover td {
background: #faf4f2;
}
<table class="hor-zebra">
<thead>
<tr>
<th scope="col">
<span>Title</span>
</th>
<th scope="col">
<span>Date</span>
</th>
<th scope="col">
<span>Actions</span>
</th>
</tr>
</thead>
<tbody>
<tr>
<td class="odd">
<a href="x">x</a>
</td>
<td class="odd">
<span>2017-10-30 19:06:27</span>
</td>
<td class="odd">
<span>
\t \t \t <a href="index.php?open=pages&page=edit_page&page_id=1&editor_language=en">Edit</a>
\t \t \t ·
\t \t \t <a href="index.php?open=pages&page=delete_page&page_id=1&editor_language=en">Delete</a>
\t \t \t </span>
</td>
</tr>
<tr>
<td>
<a href="x">awd</a>
</td>
<td>
<span>2017-10-30 19:06:35</span>
</td>
<td>
<span>
\t \t \t <a href="index.php?open=pages&page=edit_page&page_id=2&editor_language=en">Edit</a>
\t \t \t ·
\t \t \t <a href="index.php?open=pages&page=delete_page&page_id=2&editor_language=en">Delete</a>
\t \t \t </span>
</td>
</tr>
<tr>
<td class="odd">
<a href="x">awd</a>
</td>
<td class="odd">
<span>2017-10-30 19:14:53</span>
</td>
<td class="odd">
<span>
\t \t \t <a href="index.php?open=pages&page=edit_page&page_id=3&editor_language=en">Edit</a>
\t \t \t ·
\t \t \t <a href="index.php?open=pages&page=delete_page&page_id=3&editor_language=en">Delete</a>
\t \t \t </span>
</td>
</tr>
<tr>
<td>
<a href="x">awd</a>
</td>
<td>
<span>2017-10-30 19:15:07</span>
</td>
<td>
<span>
\t \t \t <a href="index.php?open=pages&page=edit_page&page_id=4&editor_language=en">Edit</a>
\t \t \t ·
\t \t \t <a href="index.php?open=pages&page=delete_page&page_id=4&editor_language=en">Delete</a>
\t \t \t </span>
</td>
</tr>
<tr>
<td class="odd">
<a href="x">awd</a>
</td>
<td class="odd">
<span>2017-10-30 19:16:47</span>
</td>
<td class="odd">
<span>
\t \t \t <a href="index.php?open=pages&page=edit_page&page_id=5&editor_language=en">Edit</a>
\t \t \t ·
\t \t \t <a href="index.php?open=pages&page=delete_page&page_id=5&editor_language=en">Delete</a>
\t \t \t </span>
</td>
</tr>
</tbody>
</table>
!