При използване на TABLE таблици, начинаещите в HTML продукцията ще се сблъскат с това как да променят дебелината на ръба, защото стандартната настройка на ръбовете TABLE е много дебела, дори и да е 1px. Затова съществуват и други методи за създаване на тънки линии, а ето метод за използване на CSS за реализиране на тънки линии, който е много ефективен и съвместим с всички браузъри.
Ако просто зададете рамката за таблица с тънки линии, е трудно да се гарантира, че браузърът е съвместим. Честа практика е използването на "border-collapse:collapse" в CSS2; граници на таблицата за сливане на атрибути; И задайте лявата и горната граница за елементите на таблицата, а дясната и долната граница за елементите th и td.
HTML:
<table> <tr> <th>Глава на таблица (ред1, COL1)</th> <th>Глава на таблица (ред1, COL2)</th> <th>Глава на таблица (ред1, COL3)</th> </tr> <tr> <td>Таблица данни (ред1, COL1)</td> <td>Таблицни данни (ред1, COL2)</td> <td>Таблицни данни (ред1, COL3)</td> </tr> <tr> <td>Таблицни данни (ред2, COL1)</td> <td>Таблицни данни (ред 2, COL2)</td> <td>Таблица данни (ред 2, COL3)</td> </tr>
CSS</table>:
table{border-collapse:collapse; разстояние между границите:0; border-left: 1px solid #888; border-top:1px solid #888; Предистория: #efefef; }
th,td{border-right:1px solid #888; border-bottom:1px solid #888; напълване: 5px 15px; }
th{font-weight:bold; Предистория: #ccc; } |
Публикувано в 18.04.2015 г. 22:19:21 ч.
|
|
|
|
Публикувано в 15.07.2015 г. 1:06:57 ч.
|
Хазяин|
Публикувано в 11.03.2021 г. 10:51:40 ч.
|
Вижте поддръжката
