Drei Methoden zur Lösung von Problemen bei der Ausrichtung von Tabellenbreite und -höhe in HTML

Viele Programmierer werden beim Erstellen von Websites auf das Problem stoßen, dass Tabellen nicht ausgerichtet werden können. Wie stellt man also die Breite und Höhe von Zellen in Tabellen in HTML ein? Fassen wir die drei Methoden zum Festlegen der Tabellenbreiten- und -höhenausrichtung in HTML zusammen.

Wenn Programmierer Webseiten erstellen, stoßen sie häufig auf das Problem falsch ausgerichteter Tabellenbreiten. Ich habe mir die Details der Höhen- und Breiteneinstellungen der Tabellen-Tag-Tabelle in HTML angesehen und fasse sie nun wie folgt zusammen:

1 Die Breiten- und Höheneinstellungen in der Tabelle und ihre Funktionen : Die in der Tabelle festgelegte Höhe legt tatsächlich einen Mindestwert fest. Wenn der Inhalt oder die Gesamtzeilenhöhe diesen festgelegten Wert überschreitet, wird der Höhenwert der Tabelle automatisch erweitert in der Tabelle diesen Wert nicht erreicht, wird er automatisch auf diesen Wert erweitert. Der in der Tabelle festgelegte Breitenwert ist im Allgemeinen der Maximalwert der Tabellenbreite und kann nicht geändert werden, auch wenn die interne Inhaltsbreite diesen Wert überschreitet. (Wenn der interne Inhalt ein Bild ist, kann die Tabellenbreite geändert werden.)

2. Die Breiten- und Höheneinstellungen im tr-Tag und ihre Funktionen

: Die Breiteneinstellung im tr Das Tag hat keine Funktion, da die Breite der Tabelle, wie aus dem ersten Punkt hervorgeht, nicht geändert werden kann und das Tag tr natürlich nicht funktioniert. Daher kann hier nur auf die Höheneinstellung in tr eingegangen werden. Die Höheneinstellung in tr bezieht sich auf die Einstellungen zwischen mehreren tr. Wenn mehrere Trs mit bestimmten Höhenwerten eingestellt werden, wird die Höhe jedes Trs dem Gesamthöhenwert proportional zum eingestellten Wert zugeordnet. Beachten Sie, dass dies der Gesamthöhenwert ist. Wenn mehrere Trs keinen bestimmten Höhenwert festlegen, wird der Gesamthöhenwert gleichmäßig verteilt. Wenn einige TRs mit bestimmten Werten und andere nicht mit bestimmten Werten als Standard festgelegt sind, stellen Sie zunächst sicher, dass die Grundbedürfnisse jedes TRs erfüllt sind, und dann erfüllen die restlichen TRs die TRs mit bestimmten festgelegten Werten und dann alle die TRs ohne spezifische Werte werden tr gesetzt. Im letzten Fall müssen wir berücksichtigen, dass die Gesamtbreite nicht für den Gesamteinstellungswert von tr ausreicht. Wenn sie nicht ausreicht, muss sie die Grundanforderungen von tr erfüllen. Die Höhe der Tabelle wird hier automatisch erweitert. Betrachten Sie dann tr mit eingestellter Höhe und schließlich tr ohne eingestellte Höhe. 3.

Die Breiten- und Höheneinstellungen im td-Tag und ihre Funktionen

: Die Breite und Höhe im td-Tag sind alle wirksam. Schauen wir uns zunächst die Breite eines bestimmten TD an. Die größte Breite unter ihnen wird als die Breite jedes TD in dieser Spalte angesehen Meistens müssen Sie die Breite eines bestimmten TD aus einer globalen Perspektive erfassen. Sie können seine Breite nicht anhand der Breiteneinstellung dieses TD bestimmen. Sobald wir die Breite jeder Spalte ermittelt haben, wird die Handhabung einfacher. Zu diesem Zeitpunkt basiert die Breitenverteilung zwischen jedem TD auf der Höhenverteilungsregel jedes Tr im zweiten Artikel. Der einzige Unterschied besteht darin, dass die Breite jedes TD standardmäßig nicht gleichmäßig, sondern proportional zu ihrer tatsächlichen Verteilung verteilt wird Inhalte verteilen. Schauen wir uns die Höheneinstellung von td an. Die Höhe jedes td hängt jedoch von der maximalen Höhe der Zeile ab, in der sich das td befindet jeder Reihe wird durch die Höhe von tr bestimmt. Das Prinzip der Höhenzuordnung ist das gleiche. Zu beachten ist außerdem die Beziehung zwischen der Höhe von td und der Höhe von tr. Zunächst muss es auf den Anforderungen des Inhalts basieren. Auf dieser Grundlage wird bestimmt, welche Einstellung einen größeren Wert hat einen eingestellten Wert haben, wird der eingestellte Wert verwendet. 1, verwenden Sie die traditionelle Methode

 <table width="400"> 
<tr> 
<td width="100"></td> 
<td width="100"></td> 
<td width="100"></td> 
<td width="100"></td> 
</tr> 
<table>

2, verwenden Sie CSS

<style>
.td{width:100px;}
</style>
<table width="400"> 
<tr> 
<td class="td"></td> 
<td class="td"></td> 
<td class="td"></td> 
<td class="td"></td> 
</tr> 
<table>

Das Problem, das bei den beiden oben genannten Methoden auftreten kann, besteht darin, dass, wenn die Der Inhalt überschreitet das Design. Wenn die Breite des Bildes größer als 100 ist, wird es automatisch erweitert. Passen Sie die Tabellenbreite automatisch an

3 und verwenden Sie CSS, um es auszurichten

<style>
.td{width:100px;overflow:hidden}
</style>
<table width="400"> 
<tr> 
<td class="td"></td> 
<td class="td"></td> 
<td class="td"></td> 
<td class="td"></td> 
</tr> 
<table>

In Auf diese Weise kann der überschüssige Teil ausgeblendet werden. Wenn Sie eine strenge Kontrolle benötigen, können Sie diese Methode verwenden, wenn Sie den Überlaufattributwert auf Scrollen oder Auto festlegen , können Sie den Wert des Überlaufattributs auf „Scrollen“ oder „Automatisch“ einstellen. Verwenden Sie beim Anpassen die Bildlaufleiste.

Das Obige ist eine vollständige Einführung in die drei Methoden zur Lösung des Problems der Tabellenbreiten- und -höhenausrichtung in HTML. Wenn Sie mehr über HTML-Tutorials erfahren möchten, schauen Sie sich bitte die chinesische PHP-Website an.

Das obige ist der detaillierte Inhalt vonDrei Methoden zur Lösung von Problemen bei der Ausrichtung von Tabellenbreite und -höhe in HTML. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!