Vlastnost CSS border-collapse
Příklad
Nastavte model sbalených hranic pro dvě tabulky:
#table1 {
border-collapse: separate;
}
#table2 {
border-collapse: collapse;
}
Další příklady „Vyzkoušejte si to sami“ níže.
Definice a použití
Vlastnost border-collapse
nastavuje, zda se mají okraje tabulky sbalit do jednoho okraje nebo být odděleny jako ve standardním HTML.
Výchozí hodnota: | samostatný |
---|---|
Zděděno: | Ano |
Animovatelné: | Ne. Přečtěte si o tématu Animable |
Verze: | CSS2 |
Syntaxe JavaScriptu: | objekt .style.borderCollapse="kolapse" |
Podpora prohlížeče
Čísla v tabulce určují první verzi prohlížeče, která plně podporuje vlastnost.
Property | |||||
---|---|---|---|---|---|
border-collapse | 1.0 | 5.0 | 1.0 | 1.2 | 4.0 |
Syntaxe CSS
border-collapse: separate|collapse|initial|inherit;
Hodnoty vlastností
Value | Description | Play it |
---|---|---|
separate | Borders are separated; each cell will display its own borders. This is default. | |
collapse | Borders are collapsed into a single border when possible (border-spacing and empty-cells properties have no effect) | |
initial | Sets this property to its default value. Read about initial | |
inherit | Inherits this property from its parent element. Read about inherit |
Další příklady
Příklad
Při použití "border-collapse: separát" lze vlastnost border-spacing použít k nastavení mezery mezi buňkami:
#table1 {
border-collapse: separate;
border-spacing: 10px;
}
Příklad
Při použití „border-collapse: collapse“ „vyhraje“ buňka, která se v kódu objeví jako první:
table, td, th {
border: 3px solid red;
}
#table1 {
border-collapse:
collapse;
border-color: blue;
}
Související stránky
CSS tutoriál: CSS tabulka
HTML DOM reference: vlastnost borderCollapse