Heim  >  Artikel  >  Web-Frontend  >  Detaillierte Erläuterung der HTML-Tabellen-Tags (geeignet für Anfänger)_HTML/Xhtml_Webseitenerstellung

Detaillierte Erläuterung der HTML-Tabellen-Tags (geeignet für Anfänger)_HTML/Xhtml_Webseitenerstellung

WBOY
WBOYOriginal
2016-05-16 16:45:091781Durchsuche

TABELLE>





这三个标记是定义表格的最重要的标记,可以说只学这三个己足够。
是一个容器标记,意思是说它用以声明这是表格而且其他表格标记只能在他的 范围内才适用,属容器标记的还有其他。
用以标示表格列(row)
Zweite Spalte, erste Spalte
show Ergebnisse
Erste Spalte, erste Spalte Erste Spalte, zweite Spalte Zweite Spalte, erste Spalte Zweite Spalte, zweite Spalte
Beispiel 5: Quellcode

用以标示储存格(cell)
的参数设定(常用):
例如:

width="400"
表格宽度,接受绝对值(如 80)及相对值(如 80%)。 border="1"
表格边框厚度,不同浏览器有不同的内定值,故请指明。 cellspacing="2"
表格格线厚度,请看例子三,那是加厚到 5 的格线。 cellpadding="2"
文字与格线的距离,请看例子四,那是加至 10 的 padding。 align="CENTER"
表格的摆放位置(水平),可选值为: left, right, center,请看例子五或六,那表格 是放于中间的,为怕一些浏览器不支援,故特加上居中标记
,只是多 层保证而己,当然只用
亦可。 valign="TOP".
表格内字画等的摆放贴 位置(垂直),可选值为: top, middle, bottom。 background="myweb.gif"
表格 纸,与 bgcolor 不要同用。 bgcolor="#0000FF"
表格底色,与 background 不要同用,请看例子六。 bordercolor="#FF00FF"
表格边框颜色,NC 与 IE 有不同的效果,请看例子六。 bordercolorlight="#00FF00"
表格边框向光部分的颜色,请看例子二。『只适用于 IE』 bordercolordark="#00FFFF"
表格边框背光部分的颜色,请看例子二,使用 bordercolorlight 或 bordercolordark 时 bordercolor 将会失效。『只适用于 IE』 cols="2"
表格栏位数目,只是让浏览器在下载表格是先画出整个表格而己。
的参数设定(常用):
例如: align="RIGHT"
该一列内字画等的摆放贴 位置(水平),可选值为: left, center, right。 valign="MIDDLE"
该一列内字画等的摆放贴 位置(垂直),可选值为: top, middle, bottom。 bgcolor="#0000FF"
该一列底色,请看例子五。 bordercolor="#FF00FF"
该一列边框颜色,请看例子三。『只适用于 IE』 bordercolorlight="#808080"
该一列边框向光部分的颜色,请看例子三。『只适用于 IE』 bordercolordark="#FF0000"
该一列边框背光部分的颜色,请看例子三,使用 bordercolorlight 或 bordercolordark 时 bordercolor 将会失效。『只适用于 IE』
的参数设定(常用):
例如:
width="48%"
该一储存格宽度,接受绝对值(如 80)及相对值(如 80%)。 height="400"
该一储存格高度。 colspan="5"
该一储存格向右打通的栏数。请看例子六 rowspan="4"
该一储存格向下打通的列数。请看例子六 align="RIGHT"
该一储存格内字画等的摆放贴 位置(水平),可选值为: left, center, right。 valign="BOTTOM"
该一储存格内字画等的摆放贴 位置(垂直),可选值为: top, middle, bottom。 bgcolor="#FF00FF"
该一储存格底色,请看例子四。 bordercolor="#808080"
该一储存格边框颜色,请看例子三。『只适用于 IE』 bordercolorlight="#FF0000"
该一储存格边框向光部分的颜色,请看例子三。『只适用于 IE』 bordercolordark="#00FF00"
该一储存格边框背光部分的颜色,请看例子三,使用 bordercolorlight 或 bordercolordark 时 bordercolor 将会失效。『只适用于 IE』 background="myweb.gif"
该一储存格 纸,与 bgcolor 任用其一。
例子一:


只有一个储存格(cell)的表格

:
Diese drei Tags sind die wichtigsten Tags zum Definieren von Tabellen. Man kann sagen, dass es ausreicht, nur diese drei zu lernen.
ist ein Container-Tag, was bedeutet, dass es verwendet wird, um zu deklarieren, dass es sich um eine Tabelle handelt und andere Tabellen-Tags nur innerhalb seines Gültigkeitsbereichs angewendet werden können.


第一列第一栏 第一列第二栏
wird zum Markieren von Tabellenspalten (Zeilen) verwendet. wird zum Markieren von Zellen (Zellen) verwendet. Parametereinstellungen (häufig verwendet): Zum Beispiel: width="400" Tabellenbreite, akzeptiert absolute Werte (z. B. 80) und relative Werte (z. B. 80 %). border="1" Tabellenrandstärke. Verschiedene Browser haben unterschiedliche Standardwerte, also bitte angeben. cellpacing="2" Tabellenstärke der Gitterlinie, siehe Beispiel 3, das ist eine auf 5 verdickte Gitterlinie. cellpadding="2" Der Abstand zwischen dem Text und dem Raster, siehe Beispiel 4, also der Abstand addiert zu 10. align="CENTER" Die Platzierungsposition (horizontal) der Tabelle ist: links, rechts, zentriert. Bitte beachten Sie die Beispiele 5 oder 6. Die Tabelle wird in der Mitte platziert, da dies bei einigen Browsern nicht der Fall ist Unterstützen Sie es, daher wird die Mittelmarkierung
hinzugefügt. Es handelt sich lediglich um eine mehrschichtige Garantie. Natürlich kann nur
verwendet werden. valign="TOP". Die Platzierungsposition (vertikal) von Kalligraphie und Malerei in der Tabelle sind: oben, Mitte, unten. background="myweb.gif" Formularpapier, nicht mit bgcolor verwenden. bgcolor="#0000FF" Hintergrundfarbe der Tabelle, nicht mit Hintergrund verwenden. Siehe Beispiel 6. bordercolor="#FF00FF" Tabellenrandfarbe, NC und IE haben unterschiedliche Auswirkungen, siehe Beispiel 6. bordercolorlight="#00FF00" Die Farbe des dem Licht zugewandten Teils des Tischrandes, siehe Beispiel 2. „Nur für IE“ bordercolordark="#00FFFF" Die Farbe des Hintergrundbeleuchtungsteils des Tabellenrandes, siehe Beispiel 2. Bei Verwendung von bordercolorlight oder bordercolordark ist bordercolor ungültig. „Nur für IE“ cols="2" Die Anzahl der Tabellenfelder ermöglicht es dem Browser lediglich, die gesamte Tabelle zu zeichnen, bevor die Tabelle heruntergeladen wird. Parametereinstellungen (häufig verwendet): Zum Beispiel:
align="RIGHT" Die Position (horizontal) der Platzierung von Kalligraphie und Malerei in dieser Spalte. Optionale Werte sind: links, zentriert, rechts. valign="MIDDLE" Die Platzierungsposition (vertikal) von Kalligraphie und Malerei in dieser Spalte sind optionale Werte: oben, Mitte, unten. bgcolor="#0000FF" Die Hintergrundfarbe dieser Spalte finden Sie in Beispiel 5. bordercolor="#FF00FF" Die Rahmenfarbe dieser Spalte, siehe Beispiel 3. „Nur für IE“ bordercolorlight="#808080" Die Farbe des dem Licht zugewandten Teils des Randes dieser Spalte, siehe Beispiel 3. „Nur für IE“ bordercolordark="#FF0000" Die Farbe des Hintergrundbeleuchtungsteils des Randes dieser Spalte, siehe Beispiel 3. Bei Verwendung von bordercolorlight oder bordercolordark ist bordercolor ungültig. „Nur für IE“ Parametereinstellungen (häufig verwendet): Zum Beispiel:

Zweite Spalte, erste Spalte
width="48%" Diese Zellenbreite akzeptiert absolute Werte (z. B. 80) und relative Werte (z. B. 80 %). height="400" Die Höhe der Zelle. colspan="5" Die Anzahl der Spalten, die diese Zelle nach rechts öffnet. Bitte sehen Sie sich Beispiel sechs an rowspan="4" Die Anzahl der Spalten, die diese Zelle nach unten öffnet. Bitte sehen Sie sich Beispiel sechs an align="RIGHT" Die Position (horizontal) der Platzierung von Kalligraphie und Malerei in dieser Zelle. Optionale Werte sind: links, zentriert, rechts. valign="BOTTOM" Die Platzierungsposition (vertikal) von Kalligraphie und Malerei in dieser Zelle. Die optionalen Werte sind: oben, Mitte, unten. bgcolor="#FF00FF" Die Hintergrundfarbe dieser Zelle finden Sie in Beispiel 4. bordercolor="#808080" Die Farbe des Zellrandes, siehe Beispiel 3. „Nur für IE“ bordercolorlight="#FF0000" Die Farbe des dem Licht zugewandten Teils des Zellrandes, siehe Beispiel 3. „Nur für IE“ bordercolordark="#00FF00" Die Farbe des Hintergrundbeleuchtungsteils des Zellrandes. Siehe Beispiel 3. Bei Verwendung von bordercolorlight oder bordercolordark ist bordercolor ungültig. „Nur für IE“ background="myweb.gif" Dies ist ein Rasterpapier, entweder einfarbig oder bgcolor. Beispiel 1:
Eine Tabelle mit nur einer Zelle
Ergebnisse anzeigen Tabelle mit nur einer Zelle Beispiel 2:
Erste Spalte, erste Spalte Erste Spalte, zweite Spalte
Ergebnisse anzeigen
Erste Spalte, erste Spalte Erste Spalte, zweite Spalte
Beispiel 3:





第一列第一栏 第一列第二栏
第二列第一栏 第二列第二栏
Erste Spalte, erste Spalte Erste Spalte, zweite Spalte
Zweite Spalte, zweite Spalte





第一列第一栏 第一列第二栏
第二列第一栏 第二列第二栏
Ergebnisse anzeigen
Erste Spalte, erste Spalte Erste Spalte, zweite Spalte Zweite Spalte, erste Spalte Zweite Spalte, zweite Spalte
Beispiel 4:

Erste Spalte, erste Spalte Erste Spalte, zweite Spalte





第一列第一栏 第一列第二栏 第一列第三栏
第二列第一栏 第二列第二栏 第二列第三栏
Zweite Spalte, zweite Spalte



Erste Spalte, erste Spalte Erste Spalte, zweite Spalte Erste Spalte, dritte Spalte






第一列第一栏 第一列 之 第二栏及第三栏
第二列及第三列 之 第一栏 第二列第二栏 第二列第三栏
第三列第二栏 第三列第三栏
Zweite Spalte, erste Spalte Zweite Spalte, zweite Spalte td> Zweite Spalte, dritte Spalte
Ergebnisse anzeigen
Erste Spalte, erste Spalte, erste Spalte, erste Spalte Spalte 2, Spalte 1, Spalte 3, Spalte 2, Spalte 1, Spalte 2, Spalte 2, Spalte 2, Spalte 3
Beispiel 6 Originalcode
Die erste Spalte der zweiten und dritten Spalte

Die erste Spalte der ersten Spalte Die zweite und dritte Spalte der ersten Spalte
Die zweite Spalte der zweiten Spalte Die dritte Spalte der zweiten Spalte
Dritte Spalte, zweite Spalte Dritte Spalte, dritte Spalte

Ergebnisse anzeigen








Month % of IE visitor % of NC visitor
August 61% 39%
July 54% 46%
June 52% 48%

Die erste Spalte, die erste Spalte, die zweite Spalte und die dritte Spalte, die zweite Spalte und die dritte Spalte, die erste Spalte, die zweite Spalte, die zweite Spalte, die zweite Spalte, die dritte Spalte, die dritte Spalte , die zweite Spalte von drei Spalten

:
und
markieren beide eine Zelle. Der einzige Unterschied besteht darin, dass der Text in der mit
markierten Zelle fett gedruckt erscheint. Er wird normalerweise in der ersten Spalte einer Tabelle verwendet, um Spalten zu markieren . . Seine Verwendung besteht darin, die Position von zu ersetzen. Die Parametereinstellungen finden Sie unter . Wenn Sie dem Text in der mit
markierten Zelle eine Fettmarkierung
hinzufügen, hat dies natürlich den gleichen Effekt wie
.
Beispiel: Quellcode
中的头部或尾部。 valign="TOP"
该表格标题列相对于表格的摆放位置(上下),可选值为: top, bottom。和 align="TOP" 或 align="BOTTOM" 是一样的,虽然功能重复了,但如果你要标题列 置于下方及向右或向左贴 ,那末两个参数便可一 用了。当只 一个参数时, 请首选 align,因为 valign 是由 HTML 3.0 才开始的参数。
例子:







网页速成 八月份访客浏览器使用分析
Month % of IE visitor % of NC visitor
August 61% 39%
Monat % des IE-Besuchers % des NC-Besuchers
August 61% 39%
Juli 54 % 46 %
Juni 52 % 48%
Ergebnisse anzeigen Monat % der IE-Besucher % der NC-Besucher August 61 % 39 % Juli 54 % 46 % Juni 52 % 48 % ■ : wird verwendet, um eine Titelspalte für die Tabelle zu markieren, genau wie das Hinzufügen einer linierten Spalte über der Tabelle. Natürlich kann es auch darunter platziert werden, in dem normalerweise der Titel des Formulars gespeichert wird. Parametereinstellungen (häufig verwendet): Zum Beispiel: align="TOP" Die Position (horizontal) der Tabellentitelspalte relativ zur Tabelle. Optionale Werte sind: links, Mitte, rechts, oben, Mitte, unten. die Titelspalte Die Tabelle wird unten angezeigt, unabhängig davon, ob Sie am Anfang oder am Ende von in Ihrem Quellcode einfügen. valign="TOP" Die Position (oben und unten) der Tabellentitelspalte relativ zur Tabelle. Optionale Werte sind: oben, unten. Es ist dasselbe wie align="TOP" oder align="BOTTOM". Obwohl die Funktionen wiederholt werden, können die beiden Parameter zusammen verwendet werden, wenn die Titelleiste unten platziert und rechts oder links eingefügt werden soll. Wenn nur ein Parameter vorhanden ist, bevorzugen Sie bitte align, da valign ein Parameter ist, der erst in HTML 3.0 gestartet wurde. Beispiel:
Web Speed ​​​​August Besucherbrowser Nutzungsanalyse
Monat % des IE-Besuchers % des NC-Besuchers
August 61% 39%
Stellungnahme:
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