Comment masquer les bordures d'un tableau en HTML-tutoriel HTML-php.cn

Comment masquer les bordures d'un tableau en HTML

青灯夜游

Libérer： 2021-12-10 14:50:31

original

11905 Les gens l'ont consulté

Comment masquer la bordure du tableau en HTML : 1. Utilisez l'attribut style pour ajouter le style "border: none;" aux éléments table, th et td 2. Utilisez l'attribut style pour ajouter le style "border-color" : transparent;" style de l'élément table.

Comment masquer les bordures d'un tableau en HTML

L'environnement d'exploitation de ce tutoriel : système Windows7, version CSS3&&HTML5, ordinateur Dell G3.

Nous avons le tableau suivant :

<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>

Copier après la connexion

Comment masquer les bordures dun tableau en HTML

Comment masquer la bordure de ce tableau ? Voici comment procéder :

1. Ajoutez des styles border: none; aux éléments table, th et tdborder: 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>

Copier après la connexion

Comment masquer les bordures dun tableau en 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>

Copier après la connexion