h5-2

表单

<form>
        <input type="text" />
    </form>

 value表示文本框的默认值，默认文本框并排

<form>
        <input type="text" />
        <input type="text" value="请输入用户名">
    </form>

 可通过<br/>标签换行，或用<p></p>标签包裹。

空白折叠，多个空格会被一个空格表示，可通过实体符&nbsp；代替。

<form>
        用户名<input type="text" value="请输入用户名"/><br/>
        密码<input type="password" />
    </form>
    <form>
        <p>用户名<input type="text" value="请输入用户名"/></p>
        <p>密&nbsp;&nbsp;&nbsp;码<input type="password"></p>
    </form>

 type为password时，输入数据不显示

单选框

　　

<p>
            性别
            <input type="radio">男
            <input type="radio">女
            <input type="radio">保密
        </p>

 此时三种属性可同时选择，选择后不可取消，通过互斥做到只能选一个

<p>
            性别
            <input type="radio" checked name="sex">男
            <input type="radio" name="sex">女
            <input type="radio" name="sex">保密
        </p>

 通过对name命名，达到互斥，此时只能选一个。默认选择男

复选框

　　checkbox，选择后可以取消，checked默认选中酸菜鱼

<p>
        爱吃的菜
        <input type="checkbox" name="" id="">红烧肉
        <input type="checkbox" checked name="" id="">酸菜鱼
        <input type="checkbox" name="" id="">宫保鸡丁
        <input type="checkbox" name="" id="">西红柿炒鸡蛋
    </p>

下拉列表

　　select

<p>
        城市
        <select>
            <option value="">北京</option>
            <option value="" selected="selected">武汉</option>
            <!-- 或简写为<option value="" selected>武汉</option> -->
            <option value="">重庆</option>
            <option value="">南京</option>
        </select>
    </p>

 默认选中武汉。

单选框和复选框通过checked默认选项，下拉列表通过selected默认选项。

文本域

　　textarea

<p>
        留言<br/>
        <textarea name="" id="" cols="30" rows="10"></textarea>
    </p>

 cols列，rows行。

通过css改变背景颜色

<style>
        body{
            background-color: skyblue;
        }
    </style>

按钮

　　普通按钮

　　提交按钮：作用将内容提交到一个地址

　　重置按钮：回复初始值

<p>
        <input type="button" value="普通按钮">
        <input type="submit" value="提交按钮">
        <input type="reset" value="重置按钮">
    </p>

 重置前提，所有内容都在同一个form内。