HTML 的结构

  1. <html> <!-- 根元素 -->
  2.     <head><!-- 头部 -->
  3.         <title>标题头</title>
  4.         <script>// js 内容</script>
  5.         <style>/* css 内容 */</style>
  6.     </head>
  7.     <body><!-- 内容 -->
  8.         内容
  9.     </body>
  10. </html>

常用标签

  • div：块级元素，会换行，一般用于包裹其他标签

  • span：行内元素，不会换行，比较少的文字内容，是一种文本容器

  • a：超链接

    • href：超链接所跳转的路径

    • name:创建文档内的书签，对读者是不可见的

    • target属性规定提交表单后在何处显示响应：
      _self=在当前页面打开，_blank=打开新的窗口

  • ul：无序列表，里面只能够写 li

    • li：具体的列表，在 li 中可以继续写 ul 进行嵌套
      ol:有序列表
      dl:自定义标签

  • img：图片标签

    • src：图片的路径
    • alt：图片加载失败时的提示文字
    • height：图片的高度，可以配合 weight 来使用，但是建议使用一个即可

  • table（重点）：表格标签

    • border：表格的边框，cellspacing：边框与边框之间的间距，cellpadding：内容与边框之间的间距

    • tr：表示行元素，表格单元

      • th：头信息，居中且加粗文字

      • td：普通列

        • colspan：指当前列向右跨越几个列
        • rowspan：指当前列向下跨越几个行

  • form：表单标签

    • action属性定义提交表单时要执行的操作，如果省略action属性，则将action设置成当前页面

    • 表单提交的路径，method：表单提交的方法，get 和 post

      • get：参数携带在 url 路径后面

      • post：参数携带在 请求体 中

      • 关于 GET 的注意事项：

  1.      - **以名称/值对的形式将表单数据追加到 URL**
  2.      - **永远不要使用 GET 发送敏感数据！（提交的表单数据在 URL 中可见！）**
  3.      - **URL 的长度受到限制（2048 个字符）**
  4.      - **对于用户希望将结果添加为书签的表单提交很有用**
  5.      - **GET 适用于非安全数据，例如 Google 中的查询字符串**

关于 POST 的注意事项：

  1.      - **将表单数据附加在 HTTP 请求的正文中（不在 URL 中显示提交的表单数据）**
  2.      - **POST 没有大小限制，可用于发送大量数据。**
  3.      - **带有 POST 的表单提交无法添加书签**

提示：如果表单数据包含敏感信息或个人信息，请务必使用 POST！

  1.   -

target属性规定提交表单后在何处显示响应：
_self=在当前页面打开，_blank=打开新的窗口

  • input 标签：表单控件，拥有很多类型

    • type=text：文本输入框
    • type=password：密码输入框
    • type=file：文件上传
    • type=submit：提交按钮
    • type=radio:单选按钮
    • type=checkbox复选框

  • select：选择标签，下拉列表，里面可以写 option 标签

    • option：双标签，表示 select 的选项，如果没有写 value 属性，默认取文本内容作为 value
    • selected：属性，表示默认选中某一个选项

  • textarea：文本域

    • rows：文本框的高度，意思为多少行
    • cols：文本框的宽度，表示可以写多少个字