Bir tablodaki belli satırları etrafında sınır?

SORU

22 Mart 2009, Pazar

Bir tablodaki belli satırları etrafında sınır?

Bir tablodaki belli satırları etrafında bir sınır koymak için bazı HTML/CSS tasarım yapmaya çalışıyorum. Evet, gerçekten düzeni için tablo kullanmak zorunda değilim biliyorum ama tamamen henüz değiştirmek için yeterli CSS bilmiyorum.

Neyse, birden çok satır ve sütunları olan bir tablo var, bazı sitelerin ve küçük ile birleşti ve masa parçaları, basit bir sınır koymak istiyorum. Şu anda kullanıyorum, 4 ayrı CSS sınıfları (üst, alt, sol, sağ) eklemek için <td> hücreler birlikte üst, alt, sol ve sağ sırasıyla tablo.

<html>
<head>

<style type="text/css">
.top {
    border-top:thin solid;
    border-color:black;
}

.bottom {
    border-bottom:thin solid;
    border-color:black;
}

.left {
    border-left:thin solid;
    border-color:black;
}

.right {
    border-right:thin solid;
    border-color:black;
}
</style>

</head>
<body>

<table cellspacing="0">
  <tr>
    <td>no border</td>
    <td>no border here either</td>
  </tr>
  <tr>
    <td class="top left">one</td>
    <td class="top right">two</td>
  </tr>
  <tr>
    <td class="bottom left">three</td>
    <td class="bottom right">four</td>
  </tr>
  <tr>
    <td colspan="2">once again no borders</td>
  </tr>
  <tr>
    <td class="top bottom left right" colspan="2">hello</td>
  </tr>
  <tr>
    <td colspan="2">world</td>
  </tr>
</table>
</html>

Daha kolay bir yolu var benim istediğim ne var? Ama işe yaramadı üst ve alt uygulama <tr> için çalıştım. (s.s. CSS yeniyim, muhtemelen çok özledim, bu çok temel bir çözümü vardır.)

not:Çoklu kenarlıklı bölümler olması gerekiyor. Temel fikir birden fazla komşu kümeleri birden çok satır içeren her var.

CEVAP

4 HAZİRAN 2013, Salı

Nasıl tr {outline: thin solid black;}? Tr veya tbody öğeleri benim için çalışıyor, ve appears en tarayıcılar, IE 8 dahil olmak üzere uyumlu olması için ama daha önce değil.

Bunu Paylaş: