bilibili注册页面html简单分析

Form部分(html部分有省略)

昵称栏

<input name="uname" value="昵称（例：哔哩哔哩）" type="text">

属性	描述
name	定义 input 元素的名称
value	规定 input 元素的值
type	规定 input 元素的类型

因昵称可以输入任意汉字，字母，数字的组合，所以选text类型最为恰当

密码

<input name="userpwd" placeholder="密码（6-16个字符组成，区分大小写）" type="password">

placeholder 属性提供可描述输入字段预期值的提示信息（hint）。
该提示会在输入字段为空时显示，并会在字段获得焦点时消失。(HTML5中的属性)

因是输入密码，所以选择password类型。

地区选择

<select name="country_code" id="country_code">           
              <option value="1" >中国大陆</option>                      
              <option value="2" code="853">澳门特别行政区</option>            
              <option value="3" code="886">台湾地区</option>     
              <option value="4" code="1">美国</option>       
              <option value="5" code="852">香港特别行政区</option>
              ...
</select>

属性	描述
name	规定下拉列表的名称
value	定义送往服务器的选项值

select 元素是一种表单控件，可用于在表单中接受用户输入。
option 元素定义下拉列表中的一个选项（一个条目）。
浏览器将 <option> 标签中的内容作为 <select> 标签的菜单或是滚动列表中的一个元素显示。
option 元素位于 select 元素内部。

option只能与select 元素配合使用此标签，否则这个标签是没有意义的。

手机栏

<input name="tel" value="填写常用手机号" type="text">

手机验证码

<input name="code" value="手机验证码" type="text">

同意用户协议

<label>
     <input name="agree" id="agree" value="1" type="checkbox">我已同意
     <a target="_blank" href="/register/licence">
     《哔哩哔哩弹幕网用户使用   协议》</a>和
     <a target="_blank" href="http://www.bilibili.com/html/help.html#q">
       《哔哩哔哩弹幕网账号中心规范》</a>
</label>

• <label> 标签为 input 元素定义标注（标记）。
• label 元素不会向用户呈现任何特殊效果。不过，它为鼠标用户改进了可用性。如果您在 label 元素内点击文本，就会触发此控件。就是说，当用户选择该标签时，浏览器就会自动将焦点转到和标签相关的表单控件上。
• <label> 标签的 for 属性应当与相关元素的 id 属性相同。
  此处把一个input标签和两个a标签都包裹在了label标签中，省略了label的for属性，方便的实现了label与input和a的关联。
  checkbox为复选框类型，可以实现多个选择。当有多个checkbox时，可通过相同的name属性，规定为一组。value的值为传送到服务器的数据。

注册按钮

<input value="注册" type="submit">

submit类型为提交表单。