Maison  >  Article  >  interface Web  >  Explication détaillée des balises de tableau HTML (adapté aux débutants)_HTML/Xhtml_Production de pages Web

Explication détaillée des balises de tableau HTML (adapté aux débutants)_HTML/Xhtml_Production de pages Web

WBOY
WBOYoriginal
2016-05-16 16:45:091781parcourir

TABLE>


weight



这三个标记是定义表格的最重要的标记,可以说只学这三个己足够。
是一个容器标记,意思是说它用以声明这是表格而且其他表格标记只能在他的 范围内才适用,属容器标记的还有其他。
用以标示表格列(row)
Deuxième colonne, première colonne
show résultats
Première colonne, première colonne Première colonne, deuxième colonne Deuxième colonne, première colonne Deuxième colonne, deuxième colonne
Exemple 5 : Code source

用以标示储存格(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)的表格

 :
Ces trois balises sont les balises les plus importantes pour définir les tableaux. On peut dire qu'apprendre uniquement ces trois est suffisant.
est une balise conteneur, ce qui signifie qu'elle est utilisée pour déclarer qu'il s'agit d'une table et que les autres balises de table ne peuvent être appliquées que dans sa portée.


第一列第一栏 第一列第二栏
est utilisé pour marquer les colonnes (lignes) du tableau est utilisé pour marquer les cellules (cellules) réglages des paramètres (couramment utilisés) : Par exemple :
width="400" Largeur du tableau, accepte les valeurs absolues (telles que 80) et les valeurs relatives (telles que 80%). border="1" Épaisseur de la bordure du tableau. Différents navigateurs ont des valeurs par défaut différentes, veuillez donc le préciser. cellpacing="2" Épaisseur de la ligne de grille du tableau, veuillez voir l'exemple 3, qui est une ligne de grille épaissie à 5. cellpadding="2" La distance entre le texte et la grille, veuillez voir l'exemple 4, c'est-à-dire le remplissage ajouté à 10. align="CENTER" La position de placement (horizontal) du tableau. Les valeurs facultatives sont : gauche, droite, centre Veuillez voir les exemples 5 ou 6. Le tableau est placé au milieu car certains navigateurs ne le font pas. prend en charge. , donc la marque centrale
est ajoutée. Il s'agit simplement d'une garantie à plusieurs niveaux. Bien sûr, seul
peut être utilisé. valign="TOP". La position de placement (verticale) de la calligraphie et de la peinture dans le tableau est : haut, milieu, bas. background="myweb.gif" Formulaire papier, ne l'utilisez pas avec bgcolor. bgcolor="#0000FF" Couleur d'arrière-plan du tableau, ne l'utilisez pas avec l'arrière-plan. Veuillez voir l'exemple 6. bordercolor="#FF00FF" La couleur de la bordure du tableau, NC et IE ont des effets différents, veuillez voir l'exemple 6. bordercolorlight="#00FF00" La couleur de la partie orientée vers la lumière de la bordure du tableau, veuillez voir l'exemple 2. "Uniquement pour IE" bordercolordark="#00FFFF" La couleur de la partie rétroéclairée de la bordure du tableau, veuillez voir l'exemple 2. Lorsque vous utilisez bordercolorlight ou bordercolordark, bordercolor ne sera pas valide. "Uniquement pour IE" cols="2" Le nombre de champs du tableau permet simplement au navigateur de dessiner l'intégralité du tableau avant de télécharger le tableau. Paramètres des paramètres (couramment utilisés) : Par exemple :
align="RIGHT" La position (horizontale) de placement de la calligraphie et de la peinture dans cette colonne Les valeurs facultatives sont : gauche, centre, droite. valign="MIDDLE" La position de placement (verticale) de la calligraphie et de la peinture dans cette colonne Les valeurs facultatives sont : haut, milieu, bas. bgcolor="#0000FF" Pour la couleur d'arrière-plan de cette colonne, veuillez voir l'exemple 5. bordercolor="#FF00FF" La couleur de la bordure de cette colonne, veuillez voir l'exemple 3. "Uniquement pour IE" bordercolorlight="#808080" La couleur de la partie orientée vers la lumière de la bordure de cette colonne, veuillez voir l'exemple 3. "Uniquement pour IE" bordercolordark="#FF0000" La couleur de la partie rétroéclairée de la bordure de cette colonne, veuillez voir l'exemple 3. Lors de l'utilisation de bordercolorlight ou bordercolordark, bordercolor sera invalide. "Uniquement pour IE" Paramètres des paramètres (couramment utilisés) : Par exemple :

Deuxième colonne, première colonne
width="48%" Cette largeur de cellule accepte les valeurs absolues (telles que 80) et les valeurs relatives (telles que 80%). height="400" La hauteur de la cellule. colspan="5" Le nombre de colonnes que cette cellule ouvre à droite. Veuillez voir l'exemple six rowspan="4" Le nombre de colonnes que cette cellule ouvre vers le bas. Veuillez voir l'exemple six align="RIGHT" La position (horizontale) de placement de la calligraphie et de la peinture dans cette cellule. Les valeurs facultatives sont : gauche, centre, droite. valign="BOTTOM" La position de placement (verticale) de la calligraphie et de la peinture dans cette cellule. Les valeurs facultatives sont : haut, milieu, bas. bgcolor="#FF00FF" Pour la couleur d'arrière-plan de cette cellule, veuillez voir l'exemple 4. bordercolor="#808080" La couleur de la bordure de la cellule, veuillez voir l'exemple 3. "Uniquement pour IE" bordercolorlight="#FF0000" La couleur de la partie orientée vers la lumière de la bordure de la cellule, veuillez voir l'exemple 3. "Uniquement pour IE" bordercolordark="#00FF00" La couleur de la partie rétroéclairée de la bordure de la cellule. Veuillez voir l'exemple 3. Lors de l'utilisation de bordercolorlight ou bordercolordark, bordercolor ne sera pas valide. "Uniquement pour IE" background="myweb.gif" Ceci est un papier quadrillé, un ou bgcolor. Exemple 1 :
Un tableau avec une seule cellule
Afficher les résultats Tableau avec une seule cellule Exemple 2 :
Première colonne, première colonne Première colonne, deuxième colonne
Afficher les résultats
Première colonne, première colonne Première colonne, deuxième colonne
Exemple 3 :





第一列第一栏 第一列第二栏
第二列第一栏 第二列第二栏
Première colonne, première colonne Première colonne, deuxième colonne
Deuxième colonne, deuxième colonne





第一列第一栏 第一列第二栏
第二列第一栏 第二列第二栏
Afficher les résultats
Première colonne, première colonne Première colonne, deuxième colonne Deuxième colonne, première colonne Deuxième colonne, deuxième colonne
Exemple 4 :

Première colonne, première colonne Première colonne, deuxième colonne





第一列第一栏 第一列第二栏 第一列第三栏
第二列第一栏 第二列第二栏 第二列第三栏
Deuxième colonne, deuxième colonne



Première colonne, première colonne Première colonne, deuxième colonne Première colonne Troisième colonne






第一列第一栏 第一列 之 第二栏及第三栏
第二列及第三列 之 第一栏 第二列第二栏 第二列第三栏
第三列第二栏 第三列第三栏
Deuxième colonne, première colonne Deuxième colonne, deuxième colonne td> Deuxième colonne, troisième colonne
Afficher les résultats
Première colonne, première colonne, première colonne, première colonne Colonne 2, Colonne 1, Colonne 3, Colonne 2, Colonne 1, Colonne 2, Colonne 2, Colonne 2, Colonne 3
Exemple 6 Code original
La première colonne des deuxième et troisième colonnes

La première colonne de la première colonne Les deuxième et troisième colonnes de la première colonne
La deuxième colonne de la deuxième colonne La troisième colonne de la deuxième colonne
Troisième colonne, deuxième colonne Troisième colonne, troisième colonne

Afficher les résultats








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

La première colonne, la première colonne, la deuxième colonne et la troisième colonne, la deuxième colonne et la troisième colonne, la première colonne, la deuxième colonne, la deuxième colonne, la deuxième colonne, la troisième colonne, la troisième colonne , la deuxième colonne. Troisième colonne de trois colonnes

 :
et
marquent tous deux une cellule. La seule différence est que le texte de la cellule marquée par
apparaît en gras. Il est généralement utilisé dans la première colonne d'un tableau pour marquer les colonnes. . Son utilisation est de remplacer la position de . Veuillez vous référer à pour ses réglages de paramètres. Bien sûr, si vous ajoutez une marque en gras
au texte dans la cellule marquée par
, cela aura le même effet que
.
Exemple : Code source
中的头部或尾部。 valign="TOP"
该表格标题列相对于表格的摆放位置(上下),可选值为: top, bottom。和 align="TOP" 或 align="BOTTOM" 是一样的,虽然功能重复了,但如果你要标题列 置于下方及向右或向左贴 ,那末两个参数便可一 用了。当只 一个参数时, 请首选 align,因为 valign 是由 HTML 3.0 才开始的参数。
例子:







网页速成 八月份访客浏览器使用分析
Month % of IE visitor % of NC visitor
August 61% 39%
Mois % des visiteurs IE % des visiteurs NC
Août 61% 39%
Juillet 54% 46%
Juin 52% 48%
Afficher les résultats Mois % de visiteur IE % de visiteur NC Août 61% 39% Juillet 54% 46% Juin 52% 48% ■  : est utilisé pour marquer une colonne de titre pour le tableau, tout comme l'ajout d'une colonne lignée au-dessus du tableau. Bien entendu, il peut également être placé en dessous, ce qui est généralement utilisé pour stocker le titre du formulaire. réglages des paramètres (couramment utilisés) : Par exemple : align="TOP" La position (horizontale) de la colonne de titre du tableau par rapport au tableau. Les valeurs facultatives sont : gauche, centre, droite, haut, milieu, bas Si align="bottom" est utilisé, la colonne de titre Le tableau apparaîtra ci-dessous, que vous mettiez en tête ou en queue de dans votre code source. valign="TOP" La position (haut et bas) de la colonne de titre du tableau par rapport au tableau. Les valeurs facultatives sont : haut, bas. C'est la même chose que align="TOP" ou align="BOTTOM". Bien que les fonctions soient répétées, si vous souhaitez que la barre de titre soit placée en dessous et collée à droite ou à gauche, alors les deux paramètres peuvent être utilisés ensemble. Lorsqu'il n'y a qu'un seul paramètre, préférez align car valign est un paramètre lancé uniquement dans HTML 3.0. Exemple :
Navigateur de visiteur d'août à vitesse Web Analyse d'utilisation
Mois % des visiteurs IE % des visiteurs NC
Août 61% 39%
Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn