v2.1.1
Giriş yap

CSS border-collapse Özelliği

CSS2

Bu özellik, tablonun kenarlıklarının ayrı mı yoksa tek bir bütün halinde mi görüneceğini ayarlamak için kullanılır.

Yapısı (Syntax)border-collapse: separate | collapse | initial | inherit;
Varsayılan Değer separate
JavaScript Yapısı object.style.borderCollapse = "collapse"
Animasyon Özellikleri Uygulanabilir Hayır (Daha fazla detay)

Değerler

Değer Açıklama Versiyon
seperate Varsayılan değerdir ve kenarlıklar ayrı görünür. CSS2
collapse Tablonun kenarlıkları bir bütün halinde tek bir kenarlık olarak görünür. CSS2

Örnekler

collapse değeri kullanılırsa, birbirini tekrar eden kenarlık sorunu ortadan kalkıyor. Aşağıdaki örneği inceleyerek arasındaki farkı daha net bir şekilde anlayabilirsiniz.

<table class="table-seperate" border="1">
	<tr>
		<td>Tayfun Erbilen</td>
		<td>http://erbilen.net</td>
	</tr>
	<tr>
		<td>PROTOTÜRK</b>
		<td>https://prototurk.com</td>
	</tr>
</table>

<hr>

<table class="table-collapse" border="1">
	<tr>
		<td>Tayfun Erbilen</td>
		<td>http://erbilen.net</td>
	</tr>
	<tr>
		<td>PROTOTÜRK</b>
		<td>https://prototurk.com</td>
	</tr>
</table>

<style>
table {
	width: 250px;
}
table.table-seperate {
	border-collapse: seperate;
}
table.table-collapse {
	border-collapse: collapse;
}
</style>

tayfunerbilen
77 gün önce eklendi.
Github'da Düzenle
Önceki table-layout Sonraki empty-cells