如何在td文本週圍放置一些空間？

我有一個演示here我怎麼能把一些空間放在桌子旁邊的文本？也爲什麼不是css類在演示中工作？如何在td文本週圍放置一些空間？

CSS

.recomendationsTable{ 
width:100%;overflow:hidden; 
} 
.recomendationsTable tr{ 
border:#2F5882 1px solid; 
} 
.recomendationsTable tr th{ 
color :#ffffff; 
background-color: #93A8BF; 
} 
.recomendationsTable tr .odd{ 
color :#FFFFFF; 
background-color: #8EA4BB; 
border:#2F5882 1px solid; 
} 
.recomendationsTable tr .even{ 
color :#2F5882; 
background-color: #EDF1F5; 
border:#2F5882 1px solid; 
}

來源

2011-09-30 abi1964

使用** **的cellpadding的attrribute表裏面 or。 – punit

它並沒有因爲類和元素之間的空間是工作的原因。

.recomendationsTable { 
    width:100%;overflow:hidden; 
} 

.recomendationsTable tr { 
    border:#2F5882 1px solid; 
} 

.recomendationsTable tr th { 
    color :#ffffff; 
    background-color: #93A8BF; 
} 

.recomendationsTable tr.odd { 
    color :#FFFFFF; 
    background-color: #8EA4BB; 
    border:#2F5882 1px solid; 
} 

.recomendationsTable tr.even { 
    color :#2F5882; 
    background-color: #EDF1F5; 
    border:#2F5882 1px solid; 
}

此外，爲了增加空間，你需要添加以下內容（第一個值垂直填充，第二水平 - 這個例子給出了雙方10px的）：

在一個

.recomendationsTable tr td { 
    padding: 0 10px; 
}

來源

2011-09-30 13:59:40

把一個DIV小區，周圍的文本，並給予DIV一些填充。

或：

table tr td, table tr th { padding: 5px; }

來源

2011-09-30 13:55:32

添加一些填充：

td { 
    padding: 5px; 
}

至於even和odd行沒有顯示出來，只是刪除tr .even和tr .odd之間的空間。有了這個空間，CSS選擇器正在尋找even或odd類的後代。如果沒有空間，您可以告訴它尋找tr，並附上even或odd類。

在另一個說明中，最好是以編程方式生成表格而不是通過HTML字符串;這是一個小更易於維護：

var $table = jQuery("<table></table>").attr("class", "recommendationsTable"); 

var $tr = jQuery("<tr></tr>"); 
$tr.append(jQuery("<th></th>".attr("align", "left").text("Recommendation(s)")); 
$table.append($tr); 

$tr = jQuery("<tr></tr>").attr("class", "even"); 
$tr.append(jQuery("<td></td>").text(ruleactionresult1)); 
$table.append($tr); 

...

一個更好的辦法是把這個變成一個循環：

var rules = ["bbbbb", "aaaa"]; 
var classes = ["even", "odd"]; 
var i = 0; 

var $table = jQuery("<table></table>").attr("class", "recommendationsTable"); 

var $tr = jQuery("<tr></tr>"); 
$tr.append(jQuery("<th></th>".attr("align", "left").text("Recommendation(s)")); 
$table.append($tr); 

for(var i = 0; i < 5; i++) { 
    $tr = jQuery("<tr></tr>").attr("class", class[i % 2]); 
    $tr.append(jQuery("<td></td>").text(rules[i % 2])); 
    $table.append($tr); 
}

Updated fiddle。

來源

2011-09-30 13:55:33

爲什麼不能在演示中使用css類？

您應該刪除tr和.odd，TR和。甚至

之間的空間我有一個演示在這裏我怎麼可以把一些空間在左右側文本表？

使用了TD填充見上

來源

2011-09-30 13:56:54 VirtualTroll

/* 
    tr.even & tr.odd (joined) 
    means tr with the evenodd class applied 
    if there is a space, it means an element within the tr element 
*/ 
.recomendationsTable tr.odd { 
    color :#FFFFFF; 
    background-color: #8EA4BB; 
    border:#2F5882 1px solid; 
} 
.recomendationsTable tr.even { 
    color :#2F5882; 
    background-color: #EDF1F5; 
    border:#2F5882 1px solid; 
} 

/* Also, add some padding between the cell's border and the text */ 
.recomendationsTable tr th, 
.recomendationsTable tr td { 
    padding: 2px; 
}

演示答案可以found here

來源

2011-09-30 13:58:06

而且，正如其他人已經提到的，最好使用jQuery來[建立你的表]（http://jsfiddle.net/atQY8/1/），而不是插入HTML。 –

出手添加cellpadding到創建table作爲屬性，如果你想在你的CSS的TD設置新的定義類玩也即.recomendationsTable td { padding:'what ever you want';}

來源

2011-09-30 14:12:33 punit

如何在td文本週圍放置一些空間？

回答

相關問題