Создание сайта на CMS WordPress: обучение и хостинг

СВОЙСТВО BORDER-COLLAPSE

Свойство border-collapse устанавливает то, как должна отображаться рамка вокруг ячеек таблицы.

Поддержка браузеров

Синтаксис

border-collapse: separate|collapse|initial|inherit

Значения свойства

Значение	Описание
separate	Рамки разделены. Каждая ячейка будет отображать свои собственные рамки. Значение по умолчанию.
collapse	Рамки объединены в одну там, где это возможно.
initial	Устанавливает значение по умолчанию.
inherit	Унаследует значение свойства от родительского элемента.

Песочница

<table class="table-1">
    <tbody>
        <tr>
            <td> 1 </td>
            <td> 2 </td>
        </tr>
        <tr>
            <td> 3 </td>
            <td> 4 </td> 
        </tr>
    </tbody>
</table>
                   
<table class="table-2">
    <tbody>
        <tr>
            <td> 1 </td>
            <td> 2 </td>
        </tr>
        <tr>
            <td> 3 </td>
            <td> 4 </td> 
        </tr>
    </tbody>
</table>

HTML

table,
table td{
    border: 1px solid black
}

table {
    margin-bottom: 15px
}

td {
    padding: 5px 10px
}

.table-2 {
    border-collapse: collapse
}

CSS

← Перейти к списку свойств