常见标签和属性

建议学习时长：90分钟
学习方式：深入

学习目标

• 知道 超链接，标题，段落，图片，列表，标签，表格，表单相关（文本输入框，单选框，多选框，下拉框）的标签怎么写。
• 知道注释怎么写。

详细介绍

链接

链接由 定义。
常用属性

• href 链接地址，常见的链接地址有如下几种
  • https://gusouk.com/
  • /a.html
  • #aaa 页面滚动至name或id为aaa的地方
  • javascript:void(0);
  • mailto:[email protected] 邮件链接
  • tel:+491570156 电话链接
• title 提示内容
• target 链接的文档在何处显示
  • 默认在当前页显示
  • _blank 在新窗口显示
  • 值若为iframe的name值一致，则在iframe中打开

前端在做页面写链接地址时，若不知道地址，可将href设置成###。若点击a不跳转页面，而是绑定点击事件,则href设置为javascript:void(0);。

标题

1号到6号标题分别由

到

定义。

段落

段落是由

标签定义。

图片

图像由 标签定义。常用属性

• src 图片地址
• alt 加载图片失败时，显示的文字

列表

有序列表由

定义，列表的条目由
1. 定义。如

   最热单曲
   
     
   时间都去哪儿了
     
   泡沫
     
   卷珠帘
   
   

   无序列表由

   定义，列表的条目由
   • 定义。如

     a的常见属性包括
     
       
     href
       
     title
       
     name
       
     target
     
     

     标签

     标签由定义。常见属性

     • for

     表格

     表格由

     元素定义。一个普通的表格，如下：

     姓名	性别
     路飞	男
     索隆	男
     香吉士	男

     表单

     表单由

     来定义。它用于把用户输入的数据提交到后台。常见属性

     • action 提交地址。
     • method 提交方式。默认为GET

     点击提交按钮时，表单进行提交。
     提交的内容为表单元素的name属性的值与用户输入的对应元素的值。

     一个普通的表单

     
       
     
         名称
         
       
       
     
         介绍
         
       
       重置
       提交
     
     

     常见的表单输入元素有：

     • 文本框 常见属性
       • placeholder
       • value
       • maxlength 最大长度
     • 文本域 和文本框相比，可输入更多文字。常见属性
       • placeholder
       • value
       • maxlength 最大长度IE9(不包括)以下不支持
     • 单选框 。其中name的值一样的单选框只有一个能被选中
     • 复选框
     • 下拉选择框 苹果橘子
     • 数字框 。注意，其不支持maxlength属性
       • min 最小值
       • max 最大值
     • 提交按钮 提交 点击
     • 重置按钮 重置

     注意：为了能让后台辨别不同的表单元素，表单元素输入必须加name属性。

     div

     组合文档中的块级元素

     span

     组合文档中的行内元素

     注释

     注释由

     来定义。

     更多学习资源

     • MDN 的 HTML 元素参考
     • HTML标签大全

     练习题

     1 写下 百度首页 的 HTML。
     2 用户调查的页面的HTML。调查的内容包括：

     • 姓名
     • 性别 (单选按钮)
     • 所在国家 (下拉框)
     • 年龄
     • 爱好 可多选 (复选框)
     • 自我介绍

     3 用 table 元素做一个课程表。