美文网首页
表单 框架集

表单 框架集

作者: 儿懵 | 来源:发表于2018-10-24 17:12 被阅读0次

表单

文本框 输入内容的
行内块儿
可以有多个键值对 用&符号隔开
属性名=属性值
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

相关文章

  • 表单

    表单 框架集 属性hack

  • 表单 框架集

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

  • 前端 表单 框架集

    表单 from 添加表单 action 指向服务器地址from action:提交到后台服务器method=‘...

  • 表格、表单、框架集

    表格: 在HTML中,使用table标签来创建一个表格 在table标签中使用tr来表示表格中的一行,有几行就有几...

  • Java学习的第三天(前端:表单标签+框架集)

    表单标签(用于采集用户输入的数据,并且用于和服务器进行交互) html5新特性 框架集frameset 框架集指定...

  • CSS----表单、框架集

    解决父元素的高度塌陷 clearfix:after{ clearfix{ clear:both zoom:1 ...

  • 表单、框架集、图片修复

    表单: placeholder:提示文字 value:默认值 method可选值:post、get 设置请求方式:...

  • 完善clearfix、表单、框架集

    完善clearfix content:' ' display:table作为属性进行设置 父子元素可以合并编写 例...

  • 前端笔记(7)

    代码:(1)完善clearfix (2)表单 (3)_target (4)框架集 (5)ie6png图片的修复 (...

  • 2019-06-03

    css基础知识 完善 表单: 框架集 ie6png图片的修复 css3过渡动画: 例如 css3 阴影 : 语法:...

网友评论

      本文标题:表单 框架集

      本文链接:https://www.haomeiwen.com/subject/tunttqtx.html