当前位置： 首页 > article >正文

【前端基础】Day 2 HTML

article 2026/4/6 15:57:24

目录

1.表格标签

2.列表标签

3.表单标签

4.综合案例 

5.查阅文档

1.表格标签

<body><table align="center" border="1" cellpadding="0" cellspacing="0" width="500" height="100"><thead>    <!-- 可以不用thead和tbody --><tr><th>排名</th><th>关键词</th><th>趋势</th><th>进入搜索</th><th>最近七日</th><th>相关链接</th></tr></thead><tbody><tr><td>1</td><td>鬼吹灯</td><td><img src="down.jpg"></td><td>456</td><td>123</td><td><a href="#">百科</a> <a href="#">图片</a></td></tr></tbody></table>
</body>

<body><table align="center" border="1" cellspacing="0" width="500" height="250"><tr><td></td><td colspan="2"></td><!-- 合并第一行的2、3列，再把第一行第3列的格子删掉 --><td></td></tr><tr><td></td><td></td><td></td><td></td></tr><tr><td rowspan="2"></td><!-- 合并第1列的三、四行，再把第1列第四行的格子删掉 --><td></td><td></td><td></td></tr><tr><td></td><td></td><td></td></tr></table>
</body>

2.列表标签

<body><h4>无序标签</h4><ul><li>苹果</li><li>香蕉</li><li>梨</li></ul><h4>有序标签</h4><ol><li>苹果</li><li>香蕉</li><li>梨</li></ol><h4>自定义列表</h4><dl><dt>名词1</dt><dd>解释1</dd><dd>解释2</dd><dt>名词2</dt><dd>解释1</dd><dd>解释2</dd></dl>
</body>

3.表单标签

<body><form action=""><!-- test文本框，用户可以输入任何文字 -->用户名：<input type="text" name="username" value="请输入用户名" maxlength="6"> <br><!-- password密码框，用户看不见输入的密码 -->密码：<input type="password" name="pwd"> <br><!-- radio单选按钮，若加上表单元素名字name（必须相同）实现单选 -->性别：男 <input type="radio" name="sex" value="男"> 女 <input type="radio" name="sex" value="女"> <br><!-- checkbox复选框，实现多选 --><!-- 单选按钮和复选框可以设置checked属性，实现打开页面时默认选中 -->爱好：吃饭<input type="checkbox" name="hobby" value="吃饭" checked="checked"> 睡觉<input type="checkbox" name="hobby"value="睡觉"> 打豆豆<input type="checkbox" name="hobby" value="打豆豆"> <br><!-- value值可更改提交按钮上显示的文字，默认“提交” --><!-- 点击了提交按钮可以把表单域form里表单元素里面的值提交的后台服务器 --><input type="submit" value="免费注册"><!-- reset重置按钮 --><input type="reset" value="重新填写"><!-- 普通按钮button 后期结合js 搭配使用 --><input type="button" value="获取短信验证码"> <br><!-- 文件域：上传文件使用的 -->上传头像：<input type="file"> <br><!-- label标签，绑定一个表单元素 --><label for="num">QQ号码：</label> <input type="text" id="num"></form>
</body>

<body><form action="">籍贯：<select><option>火星</option><option>月球</option><option selected="selected">地球</option></select></form>
</body>

    <form action="">今日反馈：<textarea cols="50" rows="5">这个反馈留言由textarea做的</textarea></form>

4.综合案例 

<body><h4>青春不常在，抓紧谈恋爱</h4><table width="600"><form action=""><tr><td>性别</td><td><input type="radio" name="sex" id="nan"><label for="nan">男</label><input type="radio" name="sex" id="nv"> <label for="nv">女</label></td></tr><tr><td>生日</td><td><select><option>--请选择年--</option><option>1996</option><option>1997</option><option>1998</option><option>1999</option><option>2000</option><option>2001</option></select><select><option>--请选择月--</option><option>1</option><option>2</option><option>3</option><option>4</option><option>5</option><option>6</option><option>7</option><option>8</option><option>9</option><option>10</option><option>11</option><option>12</option></select><select><option>--请选择日--</option><option>1</option><option>2</option><option>3</option><option>4</option><option>5</option><option>6</option><option>7</option><option>8</option><option>9</option><option>10</option></select></td></tr><tr><td>所在地区</td><td><input type="text" value="湖南长沙"></td></tr><tr><td>婚姻状况</td><td><input type="radio" name="con" checked="checked"> 未婚<input type="radio" name="con">已婚 <inputtype="radio" name="con">离婚</td></tr><tr><td>学历</td><td><input type="text" value="本科生"></td></tr><tr><td>喜欢的类型</td><td><input type="checkbox">妩媚的<input type="checkbox">可爱的<input type="checkbox">小鲜肉<input type="checkbox">老腊肉<input type="checkbox">都喜欢</td></tr><tr><td>自我介绍</td><td><textarea>自我介绍</textarea></td></tr><tr><td></td><td><input type="submit" value="免费注册"></td></tr><tr><td></td><td><input type="checkbox" checked="checked">我同意注册条款和会员加入标准</td></tr><tr><td></td><td><a href="#" target="_blank">我是会员，立即登录</a></td></tr><tr><td></td><td><h5>我承诺</h5><ul><li>年满18岁、单身</li><li>抱着严肃的态度</li><li>真诚寻找另一半</li></ul></td></tr></form></table>
</body>

5.查阅文档

相关文章：

【前端基础】Day 2 HTML

目录 1.表格标签 2.列表标签 3.表单标签 4.综合案例 5.查阅文档 1.表格标签 <body><table align"center" border"1" cellpadding"0" cellspacing"0" width"500" height"100"><thead> …...

编程日记 2026/4/4 3:40:57

Docker run --add-host参数解析（在容器启动时向/etc/hosts文件中添加自定义的主机名与IP映射）（适用于临时调试或测试）

文章目录 Docker run --add-host 参数解析一、参数概述二、工作原理三、应用场景1. **开发与调试**2. **环境隔离**3. **跨网络访问** 四、使用示例示例 1&#xff1a;单个自定义映射示例 2&#xff1a;多个映射同时使用 五、注意事项六、总结 Docker run --add-host 参数解析 …...

编程日记 2025/10/26 8:37:10

电商网站如何解决高并发问题

电商网站如何解决高并发问题&#xff1f;当下电商行业蓬勃发展&#xff0c;电商网站面临的用户访问量和高并发问题日益严峻。在电商大促、节日促销等关键时期&#xff0c;如何确保网站稳定运行&#xff0c;提升用户体验&#xff0c;成为了电商企业亟需解决的问题。小编推荐大家…...

编程日记 2026/4/5 22:20:59

MySQL 入门“鸡”础

一、Win10 与Ubuntu安装 以下是一篇针对 Ubuntu 安装 MySQL 的过程中写的示例&#xff1a; --- # Ubuntu 安装 MySQL 详细指南 在本教程中&#xff0c;我们将向您展示如何在 Ubuntu 上安装 MySQL&#xff0c;并完成基本的安全配置。以下是具体步骤&#xff1a; # 1. 安装 …...

编程日记 2026/2/6 11:19:19

若依前后端分离框架修改3.8.9版本（重点在安全框架讲解与微信小程序登录集成）

若依模板改造&#xff08;3.8.9&#xff09; 1、基础改造 下载代码 从[RuoYi-Vue: &#x1f389; 基于SpringBoot&#xff0c;Spring Security&#xff0c;JWT&#xff0c;Vue & Element 的前后端分离权限管理系统&#xff0c;同时提供了 Vue3 的版本](https://gitee.co…...

编程日记 2026/4/4 3:21:06

selenium爬取苏宁易购平台某产品的评论

目录 selenium的介绍 1、 selenium是什么&#xff1f; 2、selenium的工作原理 3、如何使用selenium&#xff1f; webdriver浏览器驱动设置 关键步骤 代码 运行结果 注意事项 selenium的介绍 1、 selenium是什么&#xff1f; 用于Web应用程序测试的工具。可以驱动浏览…...

编程日记 2026/4/5 12:49:49

kubernetes-完美下载

话不多说&#xff0c;直接开始从0搭建k8s集群 环境&#xff1a;centous7.9 2核 20G k8s-master 192.168.37.20 k8s-node1 192.168.37.21 k8s-node2 192.168.37.22 一&#xff1a;设置主机名 #设置主机名 hostnamectl set-hostname k8s-master hostnamectl set-h…...

编程日记 2026/4/3 4:19:39

PostgreSQL 常用函数

PostgreSQL 常用函数 在数据库管理系统中&#xff0c;函数是执行特定任务的基本构建块。PostgreSQL 是一个功能强大的开源关系数据库管理系统&#xff0c;提供了丰富的内置函数&#xff0c;这些函数极大地增强了数据库操作的能力。以下是一些在 PostgreSQL 中常用的函数&#…...

编程日记 2025/8/19 14:30:02

【初阶数据结构】树和二叉树

目录 前言树的概念与结构树的概念树的相关概念树的表示 二叉树的概念及结构二叉树的概念几种特殊的二叉树1.满二叉树2.完全二叉树 二叉树的性质二叉树的存储结构1、顺序存储2、链式存储 前言 前面我们学习了顺序表&#xff0c;单链表&#xff0c;栈和队列&#xff0c;它们在逻…...

编程日记 2026/4/4 6:14:19

【中等】59.螺旋矩阵Ⅱ

题目描述 给你一个正整数 n &#xff0c;生成一个包含 1 到 n2 所有元素&#xff0c;且元素按顺时针顺序螺旋排列的 n x n 正方形矩阵 matrix 。 示例 1&#xff1a; 输入&#xff1a;n 3 输出&#xff1a;[[1,2,3],[8,9,4],[7,6,5]]示例 2&#xff1a; 输入&#xff1a;n…...

编程日记 2026/4/4 7:14:13

Spring Boot + Vue 接入腾讯云人脸识别API（SDK版本3.1.830）

一、需求分析 这次是基于一个Spring Boot Vue的在线考试系统进行二次开发&#xff0c;添加人脸识别功能以防止学生替考。其他有对应场景的也可按需接入API&#xff0c;方法大同小异。 主要有以下两个步骤&#xff1a; 人脸录入&#xff1a;将某个角色&#xff08;如学生&…...

编程日记 2026/3/19 14:26:16

测试工程师玩转DeepSeek之Prompt

以下是测试工程师使用DeepSeek的必知必会提示词指南&#xff0c;分为核心场景和高效技巧两大维度&#xff1a; 一、基础操作提示模板 1. 测试用例生成 "作为[金融系统/物联网设备/云服务]测试专家&#xff0c;请为[具体功能模块]设计测试用例&#xff0c;要求&#xff1…...

编程日记 2026/4/5 15:15:18

虚中断理解

虚中断&#xff08;Virtual Interrupt&#xff09;是指在计算机系统中&#xff0c;特别是在虚拟化环境下&#xff0c;虚拟机或虚拟操作系统中使用的一种中断机制。它允许虚拟机监控程序&#xff08;Hypervisor&#xff09;或虚拟化管理程序在虚拟机之间进行中断处理和资源管理。…...

编程日记 2025/7/14 5:29:50

PC端-发票真伪查验系统-Node.js全国发票查询接口

在现代企业的财务管理中&#xff0c;发票真伪的验证至关重要。随着电子发票的普及&#xff0c;假发票问题日益严峻&#xff0c;如何高效、准确的对发票进行真伪查验&#xff0c;已经成为各类企业在日常运营中必须解决的关键问题。翔云发票查验接口做企业财务管理、税务合规的好…...

编程日记 2026/2/26 5:21:26

给Python加入自己的函数

在日常研究中&#xff0c;我们有时候会写一些Python没有的&#xff0c;但是很多个脚本都需要用的函数&#xff0c;反复的复制函数太过麻烦&#xff0c;我们可以进行一些简单的操作来变成一个可以直接import的函数 1. 首先我们新建一个.py文件&#xff0c;把我们的函数放进去&a…...

编程日记 2025/8/24 9:11:11

JAVA中包装类和泛型 通配符

目录 1. 包装类 1.1 基本数据类型和对应的包装类 1.2 装箱和封箱 1.3 自动自动装箱和封箱 2. 什么是泛型 3. 引出泛型 3.1 语法 4. 泛型类的使⽤ 4.1 语法 4.2 ⽰例 4.3 类型推导(Type Inference) 5 泛型的上界 5.1 语法 6. 通配符 6.1 通配符解决什么问题 6.2…...

编程日记 2026/4/4 6:46:57

Qt TCP服务端和客户端程序

1、服务端程序 利用QtCreator新建QMainWindow或QWidget工程&#xff0c;绘制UI如下所示。 mainwindow.h代码如下&#xff1a; #ifndef MAINWINDOW_H #define MAINWINDOW_H#include <QMainWindow> #include <QTcpServer> #include <QTcpSocket> #include &l…...

编程日记 2026/4/5 8:41:45

level2Day5

Makefile make是工程管理器 先写了1个f1.c里面写了一个函数 然后f2.c里面也写了一个函数 还有一个头节点 又写了一个makefile的函数 输入make编译&#xff0c;但是我没装make需要装一下。 sudo apt install make 然后make&#xff0c; Makefile变量的使用 通过赋值&#xff…...

编程日记 2026/4/4 6:36:54

青少年学习编程如何平衡使用DeepSeek与独立思考

前言 对于正在学习编程的青少年来说&#xff0c;DeepSeek生成代码的功能是一把双刃剑。如果合理使用&#xff0c;它可以成为青少年学习编程的有力助手&#xff1b;但如果过度依赖&#xff0c;可能会阻碍他们的思维发展和能力提升。关键在于引导青少年正确看待工具的作用&#…...

编程日记 2026/4/2 17:51:46

MySQL 8.0 Enterprise Backup (MEB) 备份与恢复实践指南

一、MEB 核心价值与特性 1.1 产品定位 MySQL Enterprise Backup (MEB) 是Oracle官方推出的企业级物理热备份工具&#xff0c;专为MySQL 8.0设计&#xff0c;支持InnoDB/XtraDB引擎的在线备份&#xff0c;同时兼容MyISAM表的锁定备份。 1.2 核心优势 零停机热备份&#xff1…...

编程日记 2025/6/30 10:10:56

UE5从入门到精通之多人游戏编程常用函数

文章目录 前言一、权限与身份判断函数1. 服务器/客户端判断2. 网络角色判断二、网络同步与复制函数1. 变量同步2. RPC调用三、连接与会话管理函数1. 玩家连接控制2. 网络模式判断四、实用工具函数前言 UE5给我们提供了非常强大的多人网路系统，让我们可以很方便的开发多人游戏…...

编程日记 2025/7/1 14:06:06

[Web 安全] 反序列化漏洞 - 学习笔记

关注这个专栏的其他相关笔记&#xff1a;[Web 安全] Web 安全攻防 - 学习手册-CSDN博客 0x01&#xff1a;反序列化漏洞 — 漏洞介绍 反序列化漏洞是一种常见的安全漏洞&#xff0c;主要出现在应用程序将 序列化数据 重新转换为对象&#xff08;即反序列化&#xff09;的过程中…...

编程日记 2025/12/28 13:30:50

minio作为K8S后端存储

docker部署minio mkdir -p /minio/datadocker run -d \-p 9000:9000 \-p 9001:9001 \--name minio \-v /minio/data:/data \-e "MINIO_ROOT_USERjbk" \-e "MINIO_ROOT_PASSWORDjbjbjb123" \quay.io/minio/minio server /data --console-address ":90…...

编程日记 2026/4/4 6:59:26

Leetcode2717：半有序排列

题目描述&#xff1a; 给你一个下标从 0 开始、长度为 n 的整数排列 nums 。 如果排列的第一个数字等于 1 且最后一个数字等于 n &#xff0c;则称其为 半有序排列 。你可以执行多次下述操作&#xff0c;直到将 nums 变成一个 半有序排列 &#xff1a; 选择 nums 中相邻的两…...

编程日记 2025/12/5 2:05:00

redis小记

redis小记 下载redis sudo apt-get install redis-server redis基本命令 ubuntu16下的redis没有protected-mode属性&#xff0c;就算sudo启动&#xff0c;也不能往/var/spool/cron/crontabs写计划任务&#xff0c;感觉很安全 #连接到redis redis-cli -h 127.0.0.1 -p 6379 …...

编程日记 2026/4/4 6:57:28

C/C++基础知识复习（47）

1) 接口继承与实现继承的区别 接口继承 接口继承意味着定义一个类&#xff0c;它只声明一组方法&#xff08;通常是纯虚函数&#xff09;&#xff0c;但是不提供任何实现。继承这个接口的子类必须实现这些方法。接口继承的主要目的是规范化行为。 C 例子&#xff1a; 在 C 中…...

编程日记 2026/4/5 16:16:34

OkHttp、Retrofit、RxJava：一文讲清楚

一、okHttp的同步和异步请求 Call 是 OkHttp 的核心接口&#xff0c;代表一个已准备好执行的 HTTP 请求。它支持 同步 和 异步 两种模式&#xff1a; enqueue——>okHttp异步 OkHttpClient client new OkHttpClient();Request request new Request.Builder().url("…...

编程日记 2025/11/12 9:13:23

netty详细使用

Netty是一个基于Java的高性能网络应用框架&#xff0c;主要用于快速开发高性能的网络通信应用程序。以下是Netty的详细使用步骤&#xff1a; 添加Netty依赖&#xff1a;在项目的pom.xml中添加Netty的依赖项&#xff0c;例如&#xff1a; <dependency><groupId>io…...

编程日记 2026/3/4 4:10:04

计算机视觉(opencv-python)入门之图像的读取,显示,与保存

在计算机视觉领域&#xff0c;Python的cv2库是一个不可或缺的工具&#xff0c;它提供了丰富的图像处理功能。作为OpenCV的Python接口&#xff0c;cv2使得图像处理的实现变得简单而高效。 示例图片 目录 opencv获取方式 图像基本知识 颜色空间 RGB HSV CV2常用图像处理方…...

编程日记 2026/4/5 11:07:33

ActiveMQ之VirtualTopic

一句话总结&#xff1a; VirtualTopic是为了解决持久化模式下多消费端同时接收同一条消息的问题。 现实中多出现这样一个场景&#xff1a; 生产端产生了一笔订单&#xff0c;作为消息MessageOrder发了出去。 这笔订单既要入订单系统归档&#xff0c;又要入结算系统收款&#x…...

编程日记 2026/4/4 6:38:10