前端——table标签和form标签和控件：table,input的type类型，select和option,label，textarea
表格标签 table
数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等
用法
<table> 表格 <thead> 表格头 <tr> 表格行 <th> 标题行的单元格数据 <tbody> 表格主体 <td> 表格内的单元格数据 <tfoot> 表格底部 rowspan 合并行(竖着合并) colspan 合并列(横着合并) 12345678910
<body> <div class="table"><!--border 边框，cellspacing边框间隙--> <table border="1" cellspacing="0"> <!--表格头--> <thead> <!--表格行--> <tr> <!--这里使用的是th--> <th></th> <th>星期一</th> <th>星期二</th> <th>星期三</th> <th>星期四</th> <th>星期五</th> </tr> </thead> <!--表格主体--> <tbody> <!--表格行--> <tr> <td rowspan="3">上午</td> <!--这里使用的是td--> <td>语文</td> <td>数学</td> <td>英文</td> <td>生物</td> <td>化学</td> </tr> <tr> <td>语文</td> <td>数学</td> <td>英文</td> <td>生物</td> <td>化学</td> </tr> <tr> <td>语文</td> <td>数学</td> <td>英文</td> <td>生物</td> <td>化学</td> </tr> <tr> <td rowspan ="2">下午</td> <td>语文</td> <td>数学</td> <td>英文</td> <td>生物</td> <td>化学</td> </tr> <tr> <td>语文</td> <td>数学</td> <td>英文</td> <td>生物</td> <td>化学</td> </tr> </tbody> <!--表格底部--> <tfoot> <tr> <td colspan="6">课程表</td> </tr> </tfoot> </table> </div> </body>
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172表单标签 form
form 标签是块级元素,action属性是要提交到服务端处理的网址，methon属性默认是get，如果是文件的话，method是post
label标签
是行内元素,label 用来关联文本和表达元素的，点击文本时相当于点击了表达元素。
鼠标移动到”用户名“三个字时，会变成箭头，点击用户名相当于点击了输入框，优化体验， <label for="user">用户名：</label> <input type="text" name="usename" id="user" placeholder="请输入用户名" > 12345
点击按钮会选中选项，点击”男“字也会选中 <input type="radio" name="sex" value="男" id="s1"> <label for="s1">男</label> 也可以这样写： <label><input type="radio" name="sex" value="男" />男</label> 1234567
如果没有label则鼠标停留在字体上时会变成选择文本，点击无反应 <input type="radio" name="sex" value="男" />男 123
input元素
可以设置宽高，行内块元素
input type 属性，name值提交表单的时候在url存在，id 值和lable for 绑定的
textarea
用法
<form action="http://www.baidu.com"> <!-- input type="text" 输入文本，name属性会在url里 value="请输入用户名称"是默认值 readonly只读--> <p> 用户名称： <input type="text" name="txtUsename" value="请输入用户名称" readonly> </p> <p> <!--type = password 密文形式 placeholder 阴影提示字--> 用户密码： <input type="password" name="txtUsepwd" placeholder="请输入密码"> </p> <p> <!--disabled 输入框不可用--> 确认密码： <input type="password" name="txtcfmpwd" disabled> </p> <!--单选框，type="radio"，checked=''默认被选中，但是要互斥的话，name值要相同，name值不同就会复选--> <p> 用户性别： <input type="radio" name="sexrdo" value="男">男 <input type="radio" name="sexrdo" value="女" checked=''>女 </p> <!--复选框type="checkbox"，name取值尽量一致--> <p> 用户爱好： <input type="checkbox" name="chkhobby" value="吃" checked> 吃 <input type="checkbox" name="chkhobby" value="喝"> 喝 <input type="checkbox" name="chkhobox" value="玩"> 玩 <input type="checkbox" name="chkhobox" value="乐" checked> 乐 </p> <!-- 按钮 submit功能负责将表单中的表单提交给服务端 --> <p> <input type="submit" name="btnsbt" value="提交"> <input type="reset" name="btnrst" value="重置"> <input type="button" name="btnbtn" value="普通按钮"> </p> <!--文件选择框 type="file"--> <p> 请上传文件： <input type="file" name="txtfile"> </p> <!--文本域 可以调整长宽，列cols="20" 行rows="5" textarea--> <p> 自我介绍： <textarea name="txt" cols="20" rows="5" placeholder="请作自我介绍"></textarea> </p> <!--下拉列表 name urld地址中存在，通常跟option配合，选择项。size大于1是滚动效果 multiple设置以后实现多选效果，ctrl+鼠标左键进行多选--> <p>籍贯： <select name="sel" size="3" multiple> <option value="深圳">深圳</option> <option value="北京">北京</option> <option value="上海">上海</option> <!--selected 默认被选中--> <option value="广州" selected>广州</option> </select> </p> </form>
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960
相关知识
HTML标签
HTML + CSS + JavaScript 两小时快速入门教程
HTML网页设计：十一、表单
“春天里的瑞士军刀”，《Spring实战》（二）
自定义(滑动条)input[type=“range”]样式
基于ssm的鲜花植物商城管理系统
LODOP在页面让客户选择打印机
使input type=“file” 不可编辑
HTML前端基础小案例（满屋花）
Vue2 实战：开发农业生产管理系统中的作物监控与生产统计页面》 《前端开发教程：用 Vue2 打造农业管理系统，含产量分析与病虫害预警》 《Vue2 项目实战：构建农业种植管理系统，实现作物生长监控
网址: 前端——table标签和form标签和控件：table,input的type类型，select和option,label，textarea https://m.huajiangbk.com/newsview709166.html
| 上一篇: 鲜花介绍及图片 |
下一篇: 送鲜花的类型有什么？ |
