Balises communes HTML, aperçu des balises de base

1. Onglet Fichier
  • html : la balise racine du document html
  • head : balise d'en-tête, utilisée pour spécifier le code html
  • titre : balise de titre
  • corps : étiquette du corps
  • Déclaration DOCTYPE :
2. Balises de texte : balises liées au texte
<h1> to <h6> <!--标题大小,h1最大,h6最小->
<br> <!--换行标签-->
<p> <!--段落标签,换行+间隔空行-->
<hr> <!--显示一条水平线-->
    *属性:
    	*color
    	*width
    	*size
    	*align:对齐方式,默认居中
    		*center
    		*right
    		*left
<b> <!--字体加粗-->
<i> <!--字体斜体-->
<font> <!--字体标签-->
    *属性:
    	*color
    	*size
    	*face:字体
  • Définition de la propriété :
    • couleur
      • Mots anglais : rouge, vert, bleu
      • RVB : 0~255, tel que RVB(0, 0, 255)
      • #000000~#ffffff
    • largeur
      • Valeur : width='20', unité de valeur, px par défaut (pixel)
      • Valeur %, la proportion de l'élément parent relatif
3. Libellé de l'image :
<!--目录的检索:
    当前目录:./
    上级目录:../
    上上级目录:../../
-->
<img src = '../../image/ps.jpg' align="right" width="1000" height="500"/>
  • définition d'attribut
    • aligner : alignement
    • Longueur Largeur
    • hauteur largeur
    • alt : le texte alternatif de l'image, c'est-à-dire le texte affiché lorsque l'image ne peut pas être affichée
4. Libellé de la liste
  • Liste ordonnée :

    • li
  • Liste non ordonnée:

  • interface utilisateur

  • li

    <ol type="A" start="1">
        早上起来干的事
        <li>
            睁眼
        </li>
        <li>
            玩手机
        </li>
        <li>
            叠被子
        </li>
        <li>
            洗漱
        </li>
    </ol>
    
    <ul type = 'disc'><!--circie:空心圆,square:方块-->
        早上起来干的事
        <li>
            睁眼
        </li>
        <li>
            玩手机
        </li>
        <li>
            叠被子
        </li>
        <li>
            洗漱
        </li>
    </ul>
    
5. Libellé du lien :
  • a : définir un lien hypertexte

    • Les attributs:

      • href : Spécifie l'URL (Uniform Resource Locator) pour accéder à la ressource

        • cible : spécifiez la manière d'ouvrir la ressource
          • _self : valeur par défaut, ouvert sur la page en cours
          • _blank : ouvrir dans une page vierge
      • code:

        <a href="../图片标签/图片的简单展示.html" target="_parent">点击我</a>
        <a href="../图片标签/图片的简单展示.html" target="_top">点击我</a>
        <a href="../图片标签/图片的简单展示.html" target="_self">点击我</a>
        <a href="https://www.baidu.com/" target="_blank">点击我</a>
        <a href="https://www.baidu.com/" target="_blank"><img src = '../../image/ps.jpg' alt="图片加载失败"></a>
        
6. divs et spans
<body>
    <!--
        div:每一个div占满一整行,块级标签
        span:文本在一行展示,行内标签,内联标签
    -->
<span> 锄禾日当午 </span>
<span> 汗滴禾下土 </span>
<hr>
    <div>
        谁知盘中餐
    </div>
    <div>
        粒粒皆辛苦
    </div>
</body>

7. Balises sémantiques :

html5中为了提高程序的可读性,提供了一些标签。
1. <header>:页眉
2. <footer>:页脚
8. Libellé du formulaire :
	* table:定义表格
		* width:宽度
		* border:边框
		* cellpadding:定义内容和单元格的距离
		* cellspacing:定义单元格之间的距离。如果指定为0,则单元格的线会合为一条、
		* bgcolor:背景色
		* align:对齐方式
	* tr:定义行
		* bgcolor:背景色
		* align:对齐方式
	* td:定义单元格
		* colspan:合并列
		* rowspan:合并行
	* th:定义表头单元格
	* <caption>:表格标题
	* <thead>:表示表格的头部分
	* <tbody>:表示表格的体部分
	* <tfoot>:表示表格的脚部分

おすすめ

転載: blog.csdn.net/weixin_43637780/article/details/106593799