表单

文本框 输入内容的
行内块儿
可以有多个键值对 用&符号隔开
属性名=属性值
name表示是一组的
value告诉后台服务器是什么

创建标签

<form action="地址">
    用户名<input type="text" name="username"> <!--文本框-->
        用户名<input type="text" name="hello"> <!--文本框-->
    <input type="submit"> <!--提交按钮-->
</form>

默认值 value后边写的

    <form action="地址">
        用户名<input type="text" name="username" value="请输入姓名"> <!--文本框-->
        <br><br>
        <input type="submit" value="注册"> <!--提交按钮-->
    </form>

提示语句 placeholder

    <form action="demo75_target.html">
        用户名<input type="text" name="username" value="请输入姓名"> <!--文本框-->
        用户名<input type="text" name="username" placeholder="请输入6~8位字母">
        <br><br>
        <input type="submit" value="注册"> <!--提交按钮-->
    </form>

单选按钮

    <form action="demo75_target.html">
        用户名<input type="text" name="username" value="雨华是猪^(*￣(oo)￣)^" placeholder="请输入6~8位字母"> <!--文本框-->
        <br><br>
        密码<input type="password" name="password">
        <br><br>
        性别<input type="radio" name="gender" value="male">男
        <input type="radio" name="gender" value="female">女
        <br><br>
        <input type="submit" value="注册"> <!--提交按钮-->
    </form>

多选按钮

    <form action="demo75_target.html">
        用户名<input type="text" name="username" value="雨华是猪^(*￣(oo)￣)^" placeholder="请输入6~8位字母"> <!--文本框-->
        <br><br>
        密码<input type="password" name="password">
        <br><br>
        性别<input type="radio" name="gender" value="male">男
        <input type="radio" name="gender" value="female">女
        <br><br>
        爱好<input type="checkbox" value="hobby" value="zq">足球
        <input type="checkbox" value="hobby" value="blq">玻璃球
        <input type="checkbox" value="hobby" value="yyq">悠悠球
        <input type="checkbox" value="hobby" value="lq">篮球
        <input type="checkbox" value="hobby" value="pq">排球
        <input type="submit" value="注册"> <!--提交按钮-->
    </form>

下拉列表项

    <form action="demo75_target.html">
        你喜欢的明星
        <select name="star">
            <option value="wje">王嘉尔</option>
            <option value="kn">柯南</option>
            <option value="dtez">大头儿子</option>
        </select>
        <br><br>
    </form>

默认选择

checked=''checked''

    <form action="demo75_target.html">
        用户名<input type="text" name="username" value="雨华是猪^(*￣(oo)￣)^" placeholder="请输入6~8位字母"> <!--文本框-->
        <br><br>
        密码<input type="password" name="password">
        <br><br>
        性别<input type="radio" name="gender" value="male" checked="checked">男
        <input type="radio" name="gender" value="female">女
        <br><br>
        爱好<input type="checkbox" value="hobby" value="zq">足球
        <input type="checkbox" value="hobby" value="blq">玻璃球
        <input type="checkbox" value="hobby" value="yyq">悠悠球
        <input type="checkbox" value="hobby" value="lq" checked="checked">篮球
        <input type="checkbox" value="hobby" value="pq">排球
        <input type="submit" value="注册"> <!--提交按钮-->
        <br><br>
        你喜欢的明星<!-- multiple="multiple" 可多选-->
        <select name="star">
            <option value="wje">王嘉尔</option>
            <option value="kn" checked="checked">柯南</option>
            <option value="dtez">大头儿子</option>
        </select>
        <br><br>
    </form>

分组的名字

optgroup label=男|女明星 给包起来

多行文本域

        自我介绍<textarea name="info"></textarea>
        <br><br>
        <input type="submit" value="注册"> <!--提交按钮-->
        <input type="reset">
        <input type="button" value="按钮">

buttom标签 方便 可以在中间插入任何东西

<buttom type="submit"> 提交</buttom>
<buttom type="reset">重置</buttom>
<buttom type="buttom">按钮</buttom>

点击字就会自动选择

for和id是一组的了

        <label for="um">用户名</label>
        <input id="um" type="text" name="username" value="雨华是猪^(*￣(oo)￣)^"  placeholder="请输入6~8位字母"> <!--文本框-->
        <br><br>
        <lable for="pwd">密码</lable>
        <input id="pwd" type="password" name="password">

把表单分在一个组

        <fieldset>
            <label for="um">用户名</label>
            <input id="um" type="text" name="username" value="雨华是猪^(*￣(oo)￣)^"
                      placeholder="请输入6~8位字母"> <!--文本框-->
            <br><br>
            <lable for="pwd">密码</lable>
            <input id="pwd" type="password" name="password">
            <br><br>
            性别<input type="radio" name="gender" value="male" checked="checked">男
            <input type="radio" name="gender" value="female">女
            <br><br>
        </fieldset>

框架集

内联框架的升级版 可以引入多个页面
<frameset></frameset>
不能在跟body在一个页面里

row上下分 cols竖着分
<frameset rows="50%,50%">
    <frame src="表格.html"/>
    <frame src="表单.html"/>
</frameset>

嵌套 服务请求 互联网不会用这样的 公司里的还可以

<frameset cols="50%,50%">
    <frame src="表格.html"/>
    <frame src="表单.html"/>
    <frameset rows="50%,50%">
        <frame src="表格.html"/>
        <frame src="表单.html"/>
    </frameset>
</frameset>

1.png

2.png