表中兩行之間的空格？

時間 2019-12-23

標籤表中兩行之間空格简体版

原文原文鏈接

這可能經過CSS嗎？ css

我嘗試着 html

tr.classname {
  border-spacing: 5em;
}

無濟於事。也許我作錯了什麼？瀏覽器

#1樓

爲表提供間距的正確方法是使用cellpadding和cellspacing例如spa

<table cellpadding="4">

#2樓

你須要設置border-collapse: separate; 在桌子上; 大多數瀏覽器默認樣式表從border-collapse: collapse;開始border-collapse: collapse; ，邊溝間隔。 code

另外，邊界間距：在TD而不是TR 。 htm

嘗試： ci

<html><head><style type="text/css">
    #ex    { border-collapse: separate; }
    #ex td { border-spacing: 1em; }
</style></head><body>
    <table id="ex"><tr><td>A</td><td>B</td></tr><tr><td>C</td><td>D</td></tr></table>
</body>

#3樓

要建立行間距的錯覺，請將背景顏色應用於行，而後建立一個白色的粗邊框，以便建立「空格」:) it

tr 
{
   background-color: #FFD700;
   border: 10px solid white;
}

#4樓

來不及答案:) table

若是將float應用於tr元素，則能夠在具備margin屬性的兩行之間tr空格。 class

table tr{
float: left
width: 100%;
}

tr.classname {
margin-bottom:5px;
}

#5樓

我在遇到相似問題時偶然發現了這一點。我發現Varun Natraaj的答案很是有幫助，但我會使用透明邊框代替。

td { border: 1em solid transparent; }

透明邊框仍然有寬度。

相關標籤/搜索