Home >Web Front-end >HTML Tutorial >如何不改tr和td代码改变表格内边距?_html/css_WEB-ITnose

如何不改tr和td代码改变表格内边距?_html/css_WEB-ITnose

WBOY
WBOYOriginal
2016-06-21 09:46:211438browse

	<table width=386 height=74 border=1  cellpadding=0 cellspacing=0 bordercolor=#cccccc class="table1">		<tbody >			<tr>				<td width= 129 >	</td>				<td height=17 align=right width=57>2013</td>				<td align=right width=57>2012</td>				<td width=66 align=right>Change</td>				<td width=66 align=right>%</td>			</tr>			<!--上面代码可以改变-->						<!--从此以下14行代码不可以改变-->					  <tr height="17">						<td height="17">条目1</td>						<td align="right">20</td>						<td align="right">-25</td>						<td align="right">93 </td>						<td align="right">17</td>					  </tr>					  <tr height="17">						<td height="17">条目2</td>						<td align="right">14</td>						<td align="right">3.2</td>						<td align="right">67 </td>						<td align="right">231</td>					  </tr>			<!--下面代码可以改变-->		</tbody>	</table>


如何不改变tr和td代码,而改变表格内显示数字与表格边框的padding(内边距)?


回复讨论(解决方案)

从目前的代码看,要加上内边距需要对TD做CSS样式设定
如果不希望改变TD,可以试试在TD里加上DIV,把文本内容放置DIV内,之后对DIV设置CSS样式

利用css控制,这样就不用修改tr td的代码

LZ可以通过JS改变TD的样式,例如:

$(.table1 tr td).each(function() {    $(this).css({ "padding": "0px 5px 0px 5px" });});

楼上的鲜货啊!  收走了 

谢谢conanhhy。我按照你的思路,直接在css中加入了。很好用。

.table2 tbody tr td{padding:5px;}


Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn