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

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

WBOY
Freigeben: 2016-06-21 09:46:21
Original
1448 Leute haben es durchsucht

	<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>
Nach dem Login kopieren


如何不改变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" });});
Nach dem Login kopieren

楼上的鲜货啊! 收走了

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

.table2 tbody tr td{padding:5px;}
Nach dem Login kopieren


Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage