HTML：表单

来源：互联网发布：游戏客户端制作软件编辑：程序博客网时间：2024/06/05 19:17

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>Title</title></head><body><!--目标：1、掌握表单域和常用属性的使用      2、表单元素的使用      3、表单元素设置默认值表单：网站用来收集用户信息的form:表单域    action：规定表单数据提交的位置，（表单处理程序）    method: 规定表单的提交方式  get/post 默认是get,常用post表单元素：    input:        type:text 文本框             password 密码框             radio 单选按钮             checkbox 复选框             submit  提交按钮             file    文件域             reset   重置按钮             button   普通按钮             image   图片按钮             hidden  隐藏域    select：下拉列表        option:下拉项    textarea:文本域每一个表单元素都需要一个name属性,（除了按钮）用户选择的项需要设置value值，输入框的value值就是用户输入的内容--><form action="./2、表格练习.html" method="post">   <p>       用户名：<input type="text" name="username">   </p>   <p>       密码：<input type="password">   </p>    <p>        性别：<input type="radio" name="gender" value="nan">男             <input type="radio" name="gender" value="nv">女    </p>    <p>        爱好：<input type="checkbox" name="hobby" value="soccer">踢足球            <input type="checkbox" name="hobby" value="sing">唱歌            <input type="checkbox" name="hobby" value="dance">跳舞            <input type="checkbox" name="hobby" value="coding">敲代码    </p>    <p>        城市：<select name="city">                <option value="beijing">北京</option>                <option value="shanghai">上海</option>                <option value="tianjin">天津</option>                <option value="guangzhou">广州</option>            </select>    </p>    <p>        <input type="submit" value="立即注册">    </p>    <p>        文件：<input type="file" name="ufile">    </p>    <p>        <input type="reset">        <input type="button" value="普通按钮">        <input type="image" src="image/btn.png">        <input type="hidden" value="123">    </p>    <textarea name="des" cols="60" rows="20"></textarea></form></body></html>

表单默认值：

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>Title</title></head><body><!--设置默认值：  输入框：设置value值  单选按钮、复选框:checked="checked"  下拉列表项：selected="selected"  文本域：在textarea标签之间输入内容禁用表单元素：disabled="disabled"--><form action="./2、表格练习.html" method="post">    <p>        用户名：<input type="text" name="username" value="张三">    </p>    <p>        密码：<input type="password" value="123456" disabled="disabled">    </p>    <p>        性别：<input type="radio" name="gender" value="nan" disabled="disabled">男        <input type="radio" name="gender" value="nv" checked="checked">女    </p>    <p>        爱好：<input type="checkbox" name="hobby" value="soccer" disabled="disabled">踢足球        <input type="checkbox" name="hobby" value="sing" checked="checked">唱歌        <input type="checkbox" name="hobby" value="dance" checked="checked">跳舞        <input type="checkbox" name="hobby" value="coding">敲代码    </p>    <p>        城市：<select name="city">        <option value="beijing" disabled="disabled">北京</option>        <option value="shanghai">上海</option>        <option value="tianjin" selected="selected">天津</option>        <option value="guangzhou">广州</option>    </select>    </p>    <p>        <input type="submit" value="立即注册" disabled="disabled">    </p>    <p>        文件：<input type="file" name="ufile" disabled="disabled">    </p>    <p>        <input type="reset">        <input type="button" value="普通按钮">        <input type="image" src="image/btn.png">        <input type="hidden" value="123">    </p>    <textarea name="des" cols="60" rows="20">文本域默认值</textarea></form></body></html>

阅读全文

0 0