HTML

HTML

1.概念

超文本标记语言：超文本的、标记语言（HTML、XML等），不是编程语言。

2. 基础标签

1. 文件标签

   1. html
   2. head
   3. title
   4. body

2. 文本标签

   1. 注释
   2. < h1 > - < h6 >：标题标签
   3. < p >：段落标签
   4. < br >：换行标签
   5. < hr >：显示一条水平线
      • 属性：color、width、size、align(center，left，right)
      • width的值可以为m%，表示在大小为父元素的m%
   6. < b >：字体加粗
   7. < i >：斜体
   8. < font >：字体标签
      • 属性：color、size、face（字体）

3. 图片标签

   1. < img src = "image_path/image_name" align = "left" alt = "图片加载不出显示的文字" height = "200", width = "200">
   2. 一般写相对路径

4. 列表标签

   1. 有序列表：

      <ol type= "1", start="3">
          <li>吃饭</li>
          <li>睡觉</li>
          <li>打豆豆</li>
      </ol>
      

   2. 无序列表：

      <ul type= "square">
          <li>吃饭</li>
          <li>睡觉</li>
          <li>打豆豆</li>
      </ul>
      

5. 链接标签：< a>文字< /a>

   • 属性：
     • href：指定访问资源的URL（统一资源定位符）
     • target：指定打开资源的位置
       • _self：在当前页面打开
       • _blank：在空白页面打开
     • < a href = "url"> < img url = "img_url">< /a>

6. 块标签：div和span

   1. span：默认是一行展示的，行内标签，两个span之间不会换行
   2. div：每个div默认换行，块级标签

7. 语义化标签：只是为了方便标记哪里位置信息

   1. header：页眉
   2. footer：页脚

8. 表格标签

   1. table：定义表格
      • 属性：
        • width：表格宽度
        • border：边框大小
        • cellpadding：内容与单元格边框的距离
        • cellspacing：单元格之间的距离，值为0表示合为一条线
        • bgcolor：表格背景色
        • align：表格相对于父元素的对齐方式
   2. tr：定义行
   3. td：定义单元格
      • 属性：
        • rowspan：合并行，实际上是表示这个单元格占的行数
        • colspan：和并列，实际上是表示这个单元格占的列数
   4. th：定义表头，使用th定义单元格会自动加粗
   5. < caption >：表格的标题
   6. < thead>:表示表格的头
   7. < tbody>:表示表格的体
   8. < tfoot>:表示表格的脚

9. 表单标签

   1. 概念：表单是用于采集用户输入的数据，用于和服务器进行交互的。
   2. 标签：< form> ,用于定义表单，可以定义采集用户数据的范围
      • 属性：
        • action：指定提交数据的URL
        • Method：指定提交方式：
          • get：
            1. 请求参数会在地址栏显示，封装到请求行中
            2. 请求参数大小有限制
            3. 不太安全
          • post：
            1. 请求参数不会在地址栏显示，会封装在请求体中
            2. 请求参数不会有限制
            3. 相对较安全
      • 表单项的数据要想被提交，必须指定name属性
   3. 表单项标签：
      1. input：可以根据type属性值，改变元素展示的样式
         • type属性：
           • text：用于输入文本
             • 属性：
               • placeholder：用于提示用户输入，效果是显示为灰色，输入后提示文字消失
           • password：用于输入密码
           • radio：单选框
             • 要实现多个单选框的单选效果，那么这些单选框的name属性值必须一样
             • 可以指定value属性的值，用于指定被选中后提交的值
             • checked属性用于指定默认选择的值
           • checkbox：复选框
             • 可以指定value属性的值，用于指定被选中后提交的值
             • checked属性用于指定默认选择的值
           • file：文件选择框
           • hidden：隐藏域
           • submit：提交按钮
           • button：一个按钮
           • image：使用图片作文按钮
           • color：取色器
           • date：日期
      2. select：下拉列表
         1. 子元素：option用于指定有哪些列表项
      3. textarea：文本域，输入文本
         1. 属性：
            1. cols：指定文本域的列数
            2. rows：用于指定文本域的行数