HTML5 列表 表单标签

列表标签

1.无序列表

<ul>
<li>列表项1</li>
<li>列表项2</li>
<li>列表项3</li>
...
</ul>

• 没有顺序之分，并列的
• < ul>< /ul>中只能嵌套< li>< /li>
• < li>< /li>之间相当于一个容器，可以容纳所有元素

2.有序列表

<ol>
  <li>列表项1</li>
  <li>列表项2</li>
  <li>列表项2</li>
  ...
</ol>

• < ol>< /ol>中只能嵌套< li>< /li>
• < li>< /li>之间相当于一个容器，可以容纳所有元素
• 有序列表会带有自己样式属性，但在实际使用中，会用CSS来设置

3.自定义列表

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

表单标签

1.表单的组成

• 表单域
  • 包含表单元素的区域

 <form action="url地址" method="提交方式" name="表单域名称">
     </form>

属性	属性值	作用
action	url地址	指定接收并处理表单数据的服务器程序的url地址
method	get/post	设置表单数据的提交方式，其取值为get或post
name	名称	指定表单的名称，以区分同一个页面的多个表单域

• 表单控件
  • 1.input输入表单元素

    • <input type="属性值" />

    • < input />标签为单标签

    • type属性设置不同的属性值用来指定不同的控件类型

    • 属性值	描述
      button	定义可点击按钮
      checkbox	复选框
      file	输入字段和“浏览“按钮，供文件上传
      hidden	隐藏的输入字段
      image	图像形式的提交按钮
      password	密码字段，该字段的字符被掩码
      radio	单选按钮
      reset	重置按钮，重置按钮会清除表单中的所有数据
      submit	提交按钮，把表单数据发送到服务器
      text	单行输入字段，用户可在其中输入文本，默认宽度为20个字符

    • 属性	属性值	描述
      name	自定义	定义input元素的名称
      value	自定义	规定input元素的值
      checked	checked	规定input元素首次加载时应当被选中
      maxlength	正整数	规定输入字段中的字符的最大长度

    • name和value是每个表单元素都有得属性值，主要给后台人员使用

    • name表单元素的名字，单选按钮和复选框都要有相同的name值

    • checked属性主要针对单选按钮和复选框，一打开页面，可以默认选中某个表单元素

    • label标签

      • 绑定一个表单元素，点击标签内的文本时，浏览器自动将焦点转到选择对应的表单元素上

          <label for="sex">男</label>
          <input type="radio" name="sex" id="sex" />

2.select下拉表单元素

       <select>
            <option>选项1</option>
            <option>选项2</option>
            <option>选项3</option>
            ...
       </select>

• 双标签
• < option>中定义selected="selected"时，当前项即为默认选中项
  +<select>中至少有一对<option>

3.textarea文本域元素

• 定义多行文本输入的控件
• 双标签

        <textarea rows="3" cols="20">
        文本内容
        </textarea>