So verbergen Sie Tabellenränder in HTML-HTML-Tutorial-php.cn

So verbergen Sie Tabellenränder in HTML

青灯夜游

Freigeben： 2021-12-10 14:50:31

Original

11826 Leute haben es durchsucht

So verbergen Sie den Tabellenrahmen in HTML: 1. Verwenden Sie das Attribut „style“, um den Stil „border: none;“ zu den Elementen „table“, „th“ und „td“ hinzuzufügen :transparent;"-Stil für das Tabellenelement.

So verbergen Sie Tabellenränder in HTML

Die Betriebsumgebung dieses Tutorials: Windows7-System, CSS3- und HTML5-Version, Dell G3-Computer.

Wir haben die folgende Tabelle:

<table border="1">
	<tr>
		<th>姓名</th>
		<th>年龄</th>
	</tr>
	<tr>
		<td>Peter</td>
		<td>20</td>
	</tr>
	<tr>
		<td>Lois</td>
		<td>20</td>
	</tr>
</table>

Nach dem Login kopieren

So verbergen Sie Tabellenränder in HTML

Wie verstecke ich den Rand dieser Tabelle? So geht's:

1. Fügen Sie border: none;-Stile zu Tabellen-, th- und td-Elementen hinzuborder: none;样式

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
	</head>

	<body>
<table border="1" style="border: none;">
	<tr>
		<th  style="border: none;">姓名</th>
		<th  style="border: none;">年龄</th>
	</tr>
	<tr>
		<td style="border: none;">Peter</td>
		<td style="border: none;">20</td>
	</tr>
	<tr>
		<td style="border: none;">Lois</td>
		<td style="border: none;">20</td>
	</tr>
</table>
	</body>
</html>

Nach dem Login kopieren

So verbergen Sie Tabellenränder in HTML

2、给table元素添加border-color: transparent;

<table border="1"   style="max-width:90%">
	<tr>
		<th>姓名</th>
		<th>年龄</th>
	</tr>
	<tr>
		<td>Peter</td>
		<td>20</td>
	</tr>
	<tr>
		<td>Lois</td>
		<td>20</td>
	</tr>
</table>

Nach dem Login kopieren

So verbergen Sie Tabellenränder in HTML

2. Fügen Sie border-color: transparent; hinzu Stil

rrreee

🎜🎜Empfohlenes Tutorial: „🎜HTML-Video-Tutorial🎜“🎜

Das obige ist der detaillierte Inhalt vonSo verbergen Sie Tabellenränder in HTML. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!