HTML基础标签

文本标签

格式化标签.png

div和span标签

<div> 和 <span> 是没有语义的，它们就是一个盒子，用来装内容的。div是块元素，span是行内元素

图片标签

img的width和height一般情况只设置一个，这样能保证图片等比例缩放

图片属性.png

特殊字符

特殊字符.png

table

1. <thead></thead>：用于定义表格的头部。<thead> 内部必须拥有 <tr> 标签。 一般是位于第一行。
2. <tbody></tbody>：用于定义表格的主体，主要用于放数据本体 。
3. table thead tbody tr th td

4. 以上标签都是放在 <table></table> 标签中。

   
   image.png

ul无序列表

1.无序列表是指元素左侧显示的是小点，不是序列号
2.<ul></ul> 中只能嵌套 <li></li>，直接在 <ul></ul> 标签中输入其他标签或者文字的做法是不被允许的。
3.<li> 与 </li> 之间相当于一个容器，可以容纳所有元素。
4.无序列表会带有自己的样式属性，但在实际使用时，我们会使用 CSS 来设置。

ol有序列表

1.有序列表是指元素左侧显示的是序列号
2.<ol></ol> 中只能嵌套 <li></li>，直接在 <ol></ol> 标签中输入其他标签或者文字的做法是不被允许的。
3.<li> 与 </li> 之间相当于一个容器，可以容纳所有元素。
4.有序列表会带有自己的样式属性，但在实际使用时，我们会使用 CSS 来设置。

自定义列表

1.自定义列表的使用场景:自定义列表常用于对术语或名词进行解释和描述，定义列表的列表项前没有任何项目符号。在 HTML 标签中，<dl> 标签用于定义描述列表（或定义列表），该标签会与 <dt>（定义项目/名字）和 <dd>（描述每一个项目/名字）一起使用。语法如下：

    <dl>  
         <dt>名词1</dt>   
        <dd>名词1解释1</dd>   
        <dd>名词1解释2</dd>
    </dl>

2.场景

image.png

label标签

整个文本都可以被点击

 <!--第一种-->
  <label for="inputId">
     <input type="radio" id="inputId">勾选按钮
 </label>

 <!--第二种-->
 <label for="inputId"> </label>
 <input type="radio" id="inputId">勾选按钮