CSS приклад: border-collapse

Інтернет ЕксплорерChromeOperaSafariFirefoxAndroidiOS
6.0+8.0+1.0+3.5+1.0+1.0+1.0+1.0+

Коротка інформація

Значення за замовчуваннямseparate
НаслідуєтьсяНі
ЗастосовуєтьсяДо тегу <table> або до елементів, у яких значення display встановлено як table або inline-table
Посилання на специфікаціюhttp://www.w3.org/TR/CSS21/tables.html#propdef-border-collapse

Версії CSS

CSS 1CSS 2CSS 2.1CSS 3

Опис

Встановлює, як відображати межі навколо комірок таблиці. Ця властивість важлива, коли для комірок встановлена рамка, тоді в місцях з'єднання комірок отримається лінія подвійної товщини. Значення collapse змушує браузер аналізувати подібні місця в таблиці та прибирати в ній подвійні лінії. При цьому між комірками лишається лише одна межа, одночасно належна обом коміркам. Те ж правило дотримується й для зовнішніх меж, коли навколо самої таблиці додається рамка.

Синтаксис

border-collapse: collapse | separate | inherit

Значення

collapse
Лінія між комірками відображається лише одна, також ігнорується значення атрибута cellspacing.
separate
Навколо кожної комірки відображається власна рамка, в місцях дотику комірок показуються одразу дві лінії.
inherit
Наслідує значення батька.
Таблиця

Часті запитання

  • Q: Як працює властивість border-collapse в CSS?

    A: Значення 'collapse' об'єднує рамки таблиці у єдину рамку, тоді як значення 'separate' (за замовчуванням) робить рамки незалежними.

  • Q: Де використовується властивість border-collapse в CSS?

    A: Властивість border-collapse використовується для таблиць у HTML документах для визначення способу обробки рамок між комірками.

  • Q: Які значення може мати властивість border-collapse в CSS?

    A: Властивість border-collapse може мати значення 'collapse' або 'separate'.

  • Q: Як властивість border-collapse впливає на вигляд таблиці в браузері?

    A: Значення 'collapse' робить рамки таблиці однією єдиною рамкою, тоді як значення 'separate' робить рамки незалежними.

  • Q: Як встановити властивість border-collapse для таблиці в CSS?

    A: Наприклад, для встановлення значення 'collapse' для властивості border-collapse для таблиці в CSS, використовуйте селектор 'table { border-collapse: collapse; }'.