表格标签

: 定义表格整体，可以包裹多个, 1.border：表格边框的宽度 2.width：规定表格的宽度 3.cellspacing：规定单元之间的空间 : 表格的行，可以包裹多个

: 单元格，表头单元格可以换成

	: 单元格，表头单元格可以换成	<body> `<table border="3px" cellspacing="2" width="600px"> <tr> <th>序号</th> <th>姓名</th> <th>年龄</th> <th>性别</th> <th>照片</th> </tr> <tr> <td>1</td> <td>烂命华</td> <td>48</td> <td>男</td> <td><img src="C:\Users\len\Pictures\Screenshots\屏幕截图 2024-11-03 184327.png" width="100px"></td> </tr> <tr> <td>2</td> <td>李四</td> <td>19</td> <td>男</td> <td><img src="C:\Users\len\Pictures\Screenshots\屏幕截图 2024-11-03 184027.png" width="80px"></td> </tr> </table>` </body> 表单标签 : 主要是采集数据，长得和小窗口一样 1.action：表单提交的url，默认提交到当前页面 2.method：表单的提交方式 1.get：在url后面拼接表单数据，url长度有限制，默认值 2.post：在消息体（请求体）中传递，参数大小无限制表单项： 1.:定义表单项，通过type属性控制输入形式 type="text"：单行文本输入框，如输入用户名。 type="password"：密码输入框，输入内容隐藏。 type="radio"：单选按钮，同组中选唯一，如选性别。 type="checkbox"：复选框，可多选，如选兴趣爱好。 type="submit"：提交按钮，将表单数据发往服务器。 type="reset"：重置按钮，重置表单输入项值。 type="email"：电子邮件输入框，有格式校验。 type="number"：数字输入框，限输数字，可设范围等。 type="date"：日期输入框，有日期选择器。 type="time"：时间输入框，有时间选择器。 type="hidden"：隐藏输入框，传递隐藏数据。 2. 3.:定义文本域</p> <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> form { width: 300px; margin: 0 auto; padding: 20px; border: 1px solid #ccc; border-radius: 5px; background-color: #f9f9f9; } <pre><code>label { display: block; margin-bottom: 5px; } input[type="radio"], input[type="checkbox"] { margin-right: 5px; } </code></pre> </style> </head> <body> <!-- 表单开始 --> <form action="submit.php" method="post"> <!-- 用户名输入框 --> <label for="username">用户名：</label> <input type="text" id="username" placeholder="请输入用户名" /> <pre><code><!-- 密码输入框 --> <label for="password">密码：</label> <input type="password" id="password" placeholder="请输入密码" /> <!-- 性别选择单选按钮组,name要一样 --> <label for="gender">性别：</label> <input type="radio" id="male" name="gender" value="male" /> <label>男</label> <input type="radio" id="female" name="gender" value="female" /> <label>女</label> <!-- 兴趣爱好复选框组 --> 兴趣爱好： <label> <input type="checkbox" id="reading" value="reading" /> 阅读</label> <label></label><input type="checkbox" id="music" value="music" /> 音乐</label> <label></label><input type="checkbox" id="sports" value="sports" /> 运动</label> <!-- 邮箱输入框 --> <label for="email">邮箱：</label> <input type="email" id="email" placeholder="请输入您的邮箱" /> <!-- 数字输入框 --> <label for="number">数字：</label> <input type="number" id="number" min="1" max="100" step="1" placeholder="请输入一个 1 到 100 之间的数字" /> <!-- 日期输入框 --> <label for="date">日期：</label> <input type="date" id="date" /> <!-- 时间输入框 --> <label for="time">时间：</label> <input type="time" id="time" /> <!-- 描述，文本输入框 --> 描述：<textarea name="description" cols="30" rows="10" ></textarea> <br><br> <!-- 提交按钮 --> <input type="submit" value="提交" style="margin-top: 15px; display: block; width: 100%;" /> <!-- 重置按钮 --> <input type="reset" value="重置" style="margin-top: 5px; display: block; width: 100%;" /> <!-- 隐藏输入框 --> <input type="hidden" name="form_id" value="12345" /> </code></pre> </form> <!-- 表单结束 --> </body> </html>

<body>

<table border="3px" cellspacing="2" width="600px">
    <tr>
        <th>序号</th>
        <th>姓名</th>
        <th>年龄</th>
        <th>性别</th>
        <th>照片</th>
    </tr>
    <tr>
        <td>1</td>
        <td>烂命华</td>
        <td>48</td>
        <td>男</td>
        <td><img src="C:\Users\len\Pictures\Screenshots\屏幕截图 2024-11-03 184327.png" width="100px"></td>
    </tr>
    <tr>
        <td>2</td>
        <td>李四</td>
        <td>19</td>
        <td>男</td>
        <td><img src="C:\Users\len\Pictures\Screenshots\屏幕截图 2024-11-03 184027.png" width="80px"></td>

    </tr>

</table>

</body>

表单标签

: 主要是采集数据，长得和小窗口一样 1.action：表单提交的url，默认提交到当前页面

2.method：
表单的提交方式
1.get：在url后面拼接表单数据，url长度有限制，默认值
2.post：在消息体（请求体）中传递，参数大小无限制

表单项：

1.:定义表单项，通过type属性控制输入形式
type="text"：单行文本输入框，如输入用户名。
type="password"：密码输入框，输入内容隐藏。
type="radio"：单选按钮，同组中选唯一，如选性别。
type="checkbox"：复选框，可多选，如选兴趣爱好。
type="submit"：提交按钮，将表单数据发往服务器。
type="reset"：重置按钮，重置表单输入项值。
type="email"：电子邮件输入框，有格式校验。
type="number"：数字输入框，限输数字，可设范围等。
type="date"：日期输入框，有日期选择器。
type="time"：时间输入框，有时间选择器。
type="hidden"：隐藏输入框，传递隐藏数据。

3.:定义文本域</p> <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> form { width: 300px; margin: 0 auto; padding: 20px; border: 1px solid #ccc; border-radius: 5px; background-color: #f9f9f9; } <pre><code>label { display: block; margin-bottom: 5px; } input[type="radio"], input[type="checkbox"] { margin-right: 5px; } </code></pre> </style> </head> <body>  <form action="submit.php" method="post">  <label for="username">用户名：</label> <input type="text" id="username" placeholder="请输入用户名" /> <pre><code> <label for="password">密码：</label> <input type="password" id="password" placeholder="请输入密码" />  <label for="gender">性别：</label> <input type="radio" id="male" name="gender" value="male" /> <label>男</label> <input type="radio" id="female" name="gender" value="female" /> <label>女</label>  兴趣爱好： <label> <input type="checkbox" id="reading" value="reading" /> 阅读</label> <label></label><input type="checkbox" id="music" value="music" /> 音乐</label> <label></label><input type="checkbox" id="sports" value="sports" /> 运动</label>  <label for="email">邮箱：</label> <input type="email" id="email" placeholder="请输入您的邮箱" />  <label for="number">数字：</label> <input type="number" id="number" min="1" max="100" step="1" placeholder="请输入一个 1 到 100 之间的数字" />  <label for="date">日期：</label> <input type="date" id="date" />  <label for="time">时间：</label> <input type="time" id="time" />  描述：<textarea name="description" cols="30" rows="10" ></textarea> <br><br>  <input type="submit" value="提交" style="margin-top: 15px; display: block; width: 100%;" />  <input type="reset" value="重置" style="margin-top: 5px; display: block; width: 100%;" />  <input type="hidden" name="form_id" value="12345" /> </code></pre> </form>  </body> </html>

标签：javaweb,表格,标签,day3,11.10,表单,输入框,type,定义
From： https://www.cnblogs.com/Yunyuzuiluo/p/18538179

力扣题库Day3(持续更新中...)
2024/11/10x的平方根：要求：给你一个非负整数 x ，计算并返回 x 的算术平方根。由于返回类型是整数，结果只保留整数部分，小数部分将被舍去。注意：不允许使用任何内置指数函数和算符，例如 pow(x,0.5) 或者 x**0.5 。classSolution{publicintmySqrt(......
11.9 javaweb学习 day2 基础标签&样式
网页响应流程浏览器前端服务器后端服务器数据库1.浏览器请求前端2.前端响应浏览器3.浏览器请求后端4.后端请求数据库5.数据库响应后端6.后端响应浏览器网页的组成1.网页的文字，图片，音频，视频，超链接什么的，本质是前端代码2.前端代码通过浏览器的转化......
C++算法练习-day38——106.从中序和后序遍历序列构造二叉树
题目来源：.-力扣（LeetCode）题目思路分析题目要求根据一棵二叉树的中序遍历（inorder）和后序遍历（postorder）结果重建这棵二叉树。中序遍历的特点是左子树->根节点->右子树，而后序遍历的特点是左子树->右子树->根节点。利用这两个遍历的特点，我们可以递归地重建整棵树。后序......
【含文档+PPT+源码】基于JavaWeb的高校迎新系统系统
项目背景与意义随着高校招生规模的不断扩大和信息化建设的深入，大学生迎新报到工作面临着越来越多的挑战。传统的迎新报到方式，如学生排队等待、填写纸质表格等，不仅效率低下，容易出错，还给学生和学校带来了诸多不便。特别是在新生入学的高峰期，传统的迎新流程往往会导致报到现场人......
JavaWeb --cookie和session技术
Cookiecookie*客户端技术,存放在客户端,由服务器发放给用户保存*一个Cookie只能存放一个键值对Cookiecookie=newCookie(""(name),""(value));//设置cookie有效期单位秒//>0表示cookie有效期//=0删除cookie//<0会话cookiecookie.setMaxAge(0);//将cookie响应给客......
代码随想录算法训练营day39 day40| 198.打家劫舍 213.打家劫舍II 337.打家劫舍III
学习资料：https://programmercarl.com/0198.打家劫舍.html#算法公开课动态规划的打家劫舍系列和股票买卖系列（股票还有贪心算法可解）学习记录：198.打家劫舍（一维dp数组，前n间房子都可偷的情况下的最高金额，每间房子偷数都是由前一间和前两间决定）点击查看代码classSolution(object)......
代码随想录算法训练营第三十九天|Day39 动态规划
198.打家劫舍视频讲解：https://www.bilibili.com/video/BV1Te411N7SXhttps://programmercarl.com/0198.%E6%89%93%E5%AE%B6%E5%8A%AB%E8%88%8D.html思路#definemax(a,b)((a)>(b)?(a):(b))introb(int*nums,intnumsSize){if(numsSize==0){re......
11.8 javaweb学习 day1 入门
网页响应流程浏览器前端服务器后端服务器数据库1.浏览器请求前端2.前端响应浏览器3.浏览器请求后端4.后端请求数据库5.数据库响应后端6.后端响应浏览器网页的组成1.网页的文字，图片，音频，视频，超链接什么的，本质是前端代码2.前端代码通过浏览器的转化......
代码随想录算法训练营 day37 day38| 卡码网52.完全背包 518. 零钱兑换 II 377.
学习资料：https://programmercarl.com/背包问题理论基础完全背包.html#算法公开课相比于01背包，完全背包中每个物品都可以无限次的放入组合：先遍历物品，再逆序遍历背包排列：先逆序遍历背包，再遍历物品学习记录卡码网52.携带研究资料（dp[i]代表当重量为i时的最大价值）点击查看代码n......
Javaweb之servlet常见面试题
目录什么是Servlet?解释请求转发forward()方法和请求重定向sendRedirect()方法的区别?什么是Session?Session的工作原理?什么是Session？Session的工作原理：Session的特点：说一说HttpServletRequest、ServletContex和HttpSesssion三个对象的作用域?解释下Servlet生命周期?JSP和S......

11.10 javaweb day3 表格，表单标签

表格标签

表单标签

表单项：

相关文章

赞助商

阅读排行