学习笔记：html表格+表单

最新推荐文章于 2024-09-27 09:37:38 发布
最新推荐文章于 2024-09-27 09:37:38 发布
阅读量102 收藏
点赞数 2
文章标签： html 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/mutongYuchen/article/details/139861285
版权 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=, initial-scale=1.0">
    <title>表单</title>
</head>
<body>
    <h1>青春不常在，抓紧谈恋爱</h1>
    <hr>
    <form action="">
        昵称：<input type="text" placeholder="请输入昵称">
        <br>
        性别：
        <input type="radio" name="sex" id="nan" checked><label for="nan">男</label>
        <label><input type="radio" name="sex">女</label>
        <!-- 两种方法，点击男女两个字也可以选中 -->
        <br>
        密码：<input type="password" placeholder="请输入密码">
        <br>
        所在城市：
        <select>
            <option>北京</option>
            <option>重庆</option>
            <option selected>上海</option>
            <option>南京</option>
            <option>湖南</option>
        </select>
        <br>
        婚姻状态：
        <label><input type="radio" name="婚姻状态" checked>未婚</label>
        <label><input type="radio" name="婚姻状态">已婚</label>
        <label><input type="radio" name="婚姻状态">离婚</label>
        <br>
        喜欢类型：
        <label><input type="checkbox" name="类型" checked>可爱</label>
        <label><input type="checkbox" name="类型" checked>性感</label>
        <label><input type="checkbox" name="类型">御姐</label>
        <label><input type="checkbox" name="类型">萝莉</label>
        <label><input type="checkbox" name="类型">小鲜肉</label>
        <label><input type="checkbox" name="类型">大叔</label>
        <label><input type="checkbox" name="类型">绅士</label>
        <br>
        个人介绍：<br>
        <textarea cols="60" rows="20"></textarea>
        <h3>我承诺</h3>
        <ul>
            <li>年满18,单身</li>
            <li>抱着严肃态度</li>
            <li>真诚寻找另一半</li>
        </ul>
        <label><input type="checkbox" checked>我同意所有条款</label>
        <br>
        <input type="submit" value="免费注册">
        <button type="reset">重置按钮</button>
    </form>
</body>
</html>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=, initial-scale=1.0">
    <title>表单</title>
</head>
<body>
    <h1>青春不常在，抓紧谈恋爱</h1>
    <hr>
    <form action="">
        昵称：<input type="text" placeholder="请输入昵称">
        <br>
        性别：
        <input type="radio" name="sex" id="nan" checked><label for="nan">男</label>
        <label><input type="radio" name="sex">女</label>
        <!-- 两种方法，点击男女两个字也可以选中 -->
        <br>
        密码：<input type="password" placeholder="请输入密码">
        <br>
        所在城市：
        <select>
            <option>北京</option>
            <option>重庆</option>
            <option selected>上海</option>
            <option>南京</option>
            <option>湖南</option>
        </select>
        <br>
        婚姻状态：
        <label><input type="radio" name="婚姻状态" checked>未婚</label>
        <label><input type="radio" name="婚姻状态">已婚</label>
        <label><input type="radio" name="婚姻状态">离婚</label>
        <br>
        喜欢类型：
        <label><input type="checkbox" name="类型" checked>可爱</label>
        <label><input type="checkbox" name="类型" checked>性感</label>
        <label><input type="checkbox" name="类型">御姐</label>
        <label><input type="checkbox" name="类型">萝莉</label>
        <label><input type="checkbox" name="类型">小鲜肉</label>
        <label><input type="checkbox" name="类型">大叔</label>
        <label><input type="checkbox" name="类型">绅士</label>
        <br>
        个人介绍：<br>
        <textarea cols="60" rows="20"></textarea>
        <h3>我承诺</h3>
        <ul>
            <li>年满18,单身</li>
            <li>抱着严肃态度</li>
            <li>真诚寻找另一半</li>
        </ul>
        <label><input type="checkbox" checked>我同意所有条款</label>
        <br>
        <input type="submit" value="免费注册">
        <button type="reset">重置按钮</button>
    </form>
</body>
</html>

闻人写意
关注
HTML 简介+表格+列表+表单（学习笔记）
m0_73378139的博客
08-11 1377
标签用于定义列表，该标签会与<dt>（定义项目/名字）和<dd>（描述每一个项目/名字）一起使用。<dl><dt>名词1</dt><dd>名词1 解释1</dd><dd>名词1 解释2</dd><dd>名词1 解释3</dd>
HTML学习笔记：（五）常见表单和输入示例
wz_1992的博客
04-19 753
表单
html学习笔记，登陆表单
一季南凉的博客
03-26 981
这段代码是一个HTML表单，通常用于Web页面上实现用户登录功能它包含了两个输入字段，让用户输入用户名和密码，以及两个按钮，分别用于提交表单和重置表单内容还有一个链接供用户在没有账号时跳转到注册页面。里面用到的JSP表达式 用于动态生成表单提交的URL，确保无论应用部署在哪里，表单的action总是指向正确的路径。action 属性定义了表单提交（即用户点击登录按钮）后数据发送的目的地。
html学习笔记（四）——表单+表格
code_bro的博客
08-03 209
8.03 & html学习笔记（四） & 主要记录了表单表格以及css简单语法
前端学习笔记：HTML狂神说笔记
zzzzzfffftttt的博客
05-03 951
狂神说HTML笔记
前端学习笔记：表格篇
Lucifer__hell的博客
01-25 1772
1、创建表格 基础知识： 创建表格的四个元素：table、tr、th、td 1、<table>…</table>：整个表格以<table>标记开始、</table>标记结束 2、<tr>…</tr>：表格的一行，所以有几对tr 表格就有几行。 3、<td>…</td>：表格的一个单元格，一行中包含几对<td>...</td>，说明一行中就有几列。 4、<th>…</th&
前端学习笔记1：HTML
m0_52289398的博客
01-19 409
HTML基础知识
前端学习笔记（一）：HTML+CSS基础
憬淮的博客
11-16 2244
前端笔记01，web端html+css基础
web前端开发基础入门html5+css3+js学习笔记（一）
weixin_44356316的博客
08-16 1487
目录1.第一个前端程序2.前端工具的选择与安装3.VSCode开发者工具快捷键4.HTML5简介与基础骨架4.1 HTML5的DOCTYPE声明4.2 HTML5基本骨架4.2.1 html标签4.2.2 head标签4.2.3 body标签4.2.4 title标签4.2.5 meta标签5.标签之标题5.1 快捷键5.1 标题标签位置摆放6.标签之段落、换行、水平线6.1 标签之段落6.2换行6.3 水平线7.标签之图片8.图片路径详解8.1 绝对路径8.2 相对路径8.2.1 子级`/`8.2.2 父
尚硅谷前端HTML+CSS学习笔记
07-15
尚硅谷前端HTML+CSS学习笔记 1. 计算机基础知识：计算机俗称电脑，是现代一种用于高速计算的电子计算机器，可以进行数值计算、逻辑计算，还具有存储记忆功能。计算机由硬件和软件组成，硬件是看得见摸得着的物理...
Bootstrap基本样式学习笔记之表格(2)
01-21
Bootstrap实现了大量基本样式，包括表格、表单、按钮、图片等。基本的使用方法是通过添加特定的class来实现。 Bootstrap 提供了一个清晰的创建表格的布局。 0x01 表格样式 （1）基本样式：不带边框和分割线： <...
【HTML学习笔记】表格、列表、表单标签
有准备的人
09-19 445
HTML学习笔记
html TAB切换按钮变色、自动生成table
TrueLink的博客
09-24 473
/ 为当前点击的按钮添加.active-tab类。/* 文本颜色变为白色，以便在蓝色背景上可见 */// 移除所有按钮的.active-tab类。/* 鼠标悬停时显示手指形状 */// 动态生成选项卡头部和内容。// 动态生成选项卡头部和内容。/* 选中时背景色变为蓝色 */// 默认显示第一个选项卡的内容。/* 增加内边距以便点击 */// 显示对应的选项卡内容。/* 初始背景色透明 *//* 添加一些间隔 */// 更多数据...// 更多数据.../* 简单的样式 */
python：基于django的html订单提交页面
我是你大爷
09-23 713
这里给出一个基于django的html订单提交页面，具有文件上传和订单提交两个功能，使用javascript来代理实现交互功能。
python：基于django的html二维码页面生成功能页面
我是你大爷
09-23 545
这里给出一个基于django的html二维码页面生成功能页面，具有文件上传和订单提交两个功能，使用javascript来代理实现交互功能（包含无限扩展内容框生成功能）。
HTML粉色烟花秀
兔子王
09-21 7227
HTML语言实现的粉红色跨年烟花秀的完整代码。
html TAB切换按钮变色、自动生成table--使用函数优化结构
TrueLink的博客
09-24 859
<!DOCTYPE html> <head> <meta charset="UTF-8"> <title>Dynamic Tabs with Table Data</title> <style> /* 简单的样式 */ .tab-content { display: none; border: 1px solid #ccc; padding: 1px
HTML中的padding和margin
最新发布
学无止境
09-27 464
作用增加元素内部的空间，使内容不显得过于拥挤。可以用来突出元素的重要性或增加视觉层次感。语法（分别对应上、右、下、左的内边距值为 10 像素和 20 像素）。也可以使用缩写形式，如（四个方向内边距均为 10 像素）。示例假设一个<div>元素，设置了，那么这个元素内部的内容与边框之间就会有 20 像素的距离。二、Margin（外边距）Margin 是指元素边框与相邻元素之间的距离。它用于控制元素之间的间隔。作用分隔不同的元素，使页面布局更加清晰。可以用来调整元素在页面中的位置。语法。
HTML5学习笔记：表格、列表与表单详解
"这份HTML5学习笔记详细记录了HTML5的基础知识，包括表格元素和列表元素的使用方法。在表格部分，讲解了HTML5的`<table>`、`<tr>`、`<td>`和`<th>`元素的结构，以及`<thead>`、`<tbody>`和`<tfoot>`的区分，展示了...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值