前端 表单 框架集

表单

from 添加表单 action 指向服务器地址
from action:提交到后台服务器
method=‘get/post’配置请求
get数据小 不需要太安全
post:请求打包 以二进制发送 比较安全
input 输入 submit 提交 value 默认值
placeholder 提示信息
单选 radio 多选 checkbox
select下拉 checked=‘checked’ 设定默认值
multiple='multiple' 多选的下拉列表
<optgroup><optgroup label> 分组 指定分组的名字
textarea 文本域
input type='reset' 重置
<button><button> 跟快捷成对出现 灵活

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表单</title>
    <style type="text/css">
        
    </style>
</head>
<body>
    <center>
        <form action="demo075-target.html" method="get">
            <!-- for 绑定点击名字就可以输入 id  fieldset 分大组 
                legend 可以起组名-->
            <fieldset>
                <legend>用户信息</legend>
                <label for="um">用户名</label> 
                <input id='um' type="text" name="username" placeholder="只能数字" >
                <br><br>
                
                <label for="pwd">密码</label> 
                <input id='pwd' type="password" name="password" >
                <br><br>
            </fieldset>
            <br><br>
            <fieldset>
                <legend>用户爱好</legend>
                性别<input type="radio" name="sex" value="male">男
                <input type="radio" name="sex" value='female'>女
                <br><br>
                爱好<input type="checkbox" name="hobby" value="zuq">足球
                <input type="checkbox" name="hobby" value="lq">篮球
                <input type="checkbox" name="hobby" value="ppq">乒乓球
                <input type="checkbox" name="hobby" value="ymq">羽毛球
                <br><br>
            </fieldset>
            你喜欢的明星
            <select name='star' >
                <option value="xzq">薛之谦</option>
                <option value="zj">张杰</option>
                <option value="sdy">宋冬野</option>
            </select>
            <br><br>
            自我介绍<textarea name="czl" id="" ></textarea>
            <br><br>

            <input type="submit"  value="注册">
            <input type="reset">
            <input type="button" value="按钮">
            <br><br>
            <button type="submit">注册</button>
            <button type="reset">按钮</button>
            <button type="button">提交</button>
        </form>
    </center>
    <!-- file:///home/xk/Desktop/3-1805%E5%89%8D%E7%AB%AF%E4%BB%A3%E7%A0%81/7.day/demo075-target.html?username=admin    ?username=admin  查询字符串  -->
    <!-- from 添加表单   action 指向服务器地址 
        from action:提交到后台服务器 
        method=‘get/post’配置请求 
        get数据小 不需要太安全 
        post:请求打包 以二进制发送 比较安全
         input 输入  submit 提交  value 默认值   
         placeholder 提示信息  
         单选 radio  多选 checkbox  
         select下拉   checked=‘checked’ 设定默认值
        multiple='multiple' 多选的下拉列表  
        <optgroup><optgroup  label> 分组  指定分组的名字 
        textarea 文本域   
        input type='reset' 重置 
        <button><button> 跟快捷成对出现 灵活 
    -->
</body>
</html>

框架集

框架集并不常用
里面不能用body 要用frameset
不能自己写网页 只能调用其他网页

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>框架集</title>
    <style type="text/css">
        
    </style>
</head>
<frameset cols="50%,50%">
    <frame src='3-表单.html'>
    <frame src="1-表格的布局.html">
    <!-- cols 列  rows 行 -->
</frameset>
</html>

猜你喜欢

转载自blog.csdn.net/weixin_34335458/article/details/87229143