Heim > Web-Frontend > HTML-Tutorial > So legen Sie den Tabellenzeilenabstand in HTML fest

So legen Sie den Tabellenzeilenabstand in HTML fest

WBOY
Freigeben: 2021-11-11 17:11:08
Original
22392 Leute haben es durchsucht

In HTML können Sie dem Tabellenelement die Stile „margin-bottom“ und „margin-top“ hinzufügen, um den Zeilenabstand festzulegen. Die Syntax lautet „

So legen Sie den Tabellenzeilenabstand in HTML fest

Die Betriebsumgebung dieses Tutorials: Windows 7-System, HTML5-Version, Dell G3-Computer.

So legen Sie den Tabellenzeilenabstand in HTML fest:

1 Sie können den Abstand zwischen dem Attribut „margin-bottom“ der Tabelle und der unteren Tabelle beibehalten, indem Sie das Attribut „margin-bottom“ festlegen, um den unteren Rand der Tabelle festzulegen Element.

Der Code lautet wie folgt:

<table style="margin-bottom:下外边间距值" >
Nach dem Login kopieren

Schauen wir uns das folgende Beispiel an:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>button</title>
</head>
<body>
<table style="border: 1px solid black;margin-bottom:100px" width="400" height="100" >
<tr>
<td style="border: 1px solid black" >1</td>
<td style="border: 1px solid black" >2</td>
<td style="border: 1px solid black" >3</td>
<td style="border: 1px solid black" >4</td>
</tr>
<table>
<table style="border: 1px solid black" width="400" height="100" >
<tr>
<td style="border: 1px solid black" >1</td>
<td style="border: 1px solid black" >2</td>
<td style="border: 1px solid black" >3</td>
<td style="border: 1px solid black" >4</td>
</tr>
<table>
</body>
</html>
Nach dem Login kopieren

Ausgabeergebnis:

So legen Sie den Tabellenzeilenabstand in HTML fest

2. Sie können den Abstand zur obigen Tabelle beibehalten, indem Sie den Rand oben festlegen der Tabelle und legen Sie das margin-top-Attribut des Elements auf den oberen Rand fest.

Der Code lautet wie folgt:

<table   style="max-width:90%" >
Nach dem Login kopieren

Sehen wir uns das folgende Beispiel an:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>button</title>
</head>
<body>
<table style="border: 1px solid black;margin-bottom:100px" width="400" height="100" >
<tr>
<td style="border: 1px solid black" >1</td>
<td style="border: 1px solid black" >2</td>
<td style="border: 1px solid black" >3</td>
<td style="border: 1px solid black" >4</td>
</tr>
<table>
<table style="border: 1px solid black;margin-top:100px" width="400" height="100" >
<tr>
<td style="border: 1px solid black" >1</td>
<td style="border: 1px solid black" >2</td>
<td style="border: 1px solid black" >3</td>
<td style="border: 1px solid black" >4</td>
</tr>
<table>
</body>
</html>
Nach dem Login kopieren

Ausgabeergebnis:

So legen Sie den Tabellenzeilenabstand in HTML fest

Weitere Programmierkenntnisse finden Sie unter: Programmiervideo! !

Das obige ist der detaillierte Inhalt vonSo legen Sie den Tabellenzeilenabstand in HTML fest. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
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