borderCollapse özelliği, table elementinde satır (tr) ve hücre (td-th) kenarlıklarının bitişik veya ayrı ayrı olmasını ayarlar.
DOM Sözdizimi
element.style.borderCollapse = bitisik
CSS Sözdizimi
border-collapse: bitisik
| bitisik | Aşağıdaki değerleri alarak satır ve hücrelerin bitişik veya ayrı olmasını sağlar.
- separate : Satır ve hücreler, birbirlerinden ayrı kenarlığa sahiptir.
- collapse : Satır ve hücreler, birbirleri ile bitişik kenarlıkları ortak kullanırlar.
|
Aşağıdaki örnek, CSS border-collapse özelliğinin collapse ve separate değerleri ile kullanımını göstermektedir.
<style type="text/css">
.tabloCol {
border-collapse:collapse;
}
.tabloSep {
border-collapse:separate;
}
.tabloCol td, .tabloSep td
{
border:solid 1px red;
}
</style>
<table class="tabloCol">
<tr>
<td colspan="2">Başlık</td>
</tr>
<tr>
<td>Hücre 1</td>
<td>Hücre 2</td>
</tr>
</table>
<br/>
<table class="tabloSep">
<tr>
<td colspan="2">Başlık</td>
</tr>
<tr>
<td>Hücre 1</td>
<td>Hücre 2</td>
</tr>
</table>
Canlı Sonuç