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

HTML之列表学习记录

news 2025/8/30 3:59:02

练习题：

图所示为一个问卷调查网页，请制作出来。要求：大标题用h1标签；小题目用h3标签；前两个问题使用有序列表；最后一个问题使用无序列表。

58cc72ec33694acab65dde7a953047f7.png

代码：

<!DOCTYPE html>
<html>
<head><meta charset="utf-8" /><title>列表练习</title>
</head>
<body>
<h1>问卷调查</h1>
<h3>1、你是通过什么途径来到绿叶学习网的？</h3>
<ol type="A"><li>百度途径</li><li>谷歌搜索</li><li>其他途径</li>
</ol>
<h3>2、你觉得绿叶学习网页设计怎么样？</h3>
<ol type="A"><li>炫酷大方</li><li>比较普通</li><li>非常粗糙</li>
</ol>
<h3>3、你觉得这本书怎么样？(多选)</h3>
<ul><li>通俗易懂，轻松幽默</li><li>内容丰富，技巧贼多</li><li>三个字，好到爆！</li>
</ul>
</ul></body>
</html>

效果图：

 

9145b4a995af4a2a92be1d3d876a9b19.png

练习过程的代码：

 

<!DOCTYPE html>
<html><head><title>列表</title><meta charset="utf-8"/></head><bady><!-- ol，即ordered list（有序列表）​。li，即list（列表项) --><h3>有序列表</h3><ol><li>第一项</li><li>第二项</li><li>第三项</li></ol><!-- ol标签和li标签是配合一起使用的，不可以单独使用，而且<ol>标签的子标签只能是li标签，不能是其他标签。 --><!-- 使用type属性来改变列表项符号 --><ol type="A"><li>第一项</li><li>第二项</li><li>第三项</li></ol><ol type="a"><li>第一项</li><li>第二项</li><li>第三项</li></ol><ol type="i"><li>第一项</li><li>第二项</li><li>第三项</li></ol><ol type="I"><li>第一项</li><li>第二项</li><li>第三项</li></ol><!-- ul，即unordered list（无序列表）​。li，即list（列表项) --><h3>无序列表</h3><ul><li>第一项</li><li>第二项</li><li>第三项</li></ul><!-- 使用type属性来改变列表项符号 --><ul type="circle"><li>第一项</li><li>第二项</li><li>第三项</li></ul><ul type="square"><li>第一项</li><li>第二项</li><li>第三项</li></ul><!-- ul元素的子元素只能是li，不能是其他元素。ul元素内部的文本，只能在li元素内部添加，不能在li元素外部添加。 --><!-- 定义列表 --><h3>定义列表</h3><dl><dt>HTML</dt><dd>制作网页的标准语言，控制网页的结构</dd><dt>CSS</dt><dd>制作网页的样式，控制网页的显示效果</dd><dt>JavaScript</dt><dd>制作网页的动态效果，控制网页的行为</dd></dl><!-- dl，即definition list（定义列表）​。dt，即definition term（定义名词）​。dd，即definition description（定义描述）​。 --></bady>
</html>

效果图：

f63ac112dd7843599e0199e43e7c63a0.png

 

相关文章：

HTML之列表学习记录

练习题&#xff1a; 图所示为一个问卷调查网页&#xff0c;请制作出来。要求&#xff1a;大标题用h1标签&#xff1b;小题目用h3标签&#xff1b;前两个问题使用有序列表&#xff1b;最后一个问题使用无序列表。 代码&#xff1a; <!DOCTYPE html> <html> <he…...

编程日记 2024/11/15 0:29:12

Redo与Undo的区别：数据库事务的恢复与撤销机制

在数据库中&#xff0c;redo 和 undo 是两个非常重要的概念&#xff0c;它们主要用于事务管理和恢复机制&#xff0c;确保数据的一致性和完整性。 下面分别解释这两个概念&#xff1a; Redo&#xff08;重做&#xff09; 定义&#xff1a;redo 操作记录了事务对数据库所做的所…...

编程日记 2024/11/15 0:28:11

【话题讨论】AI赋能电商：创新应用与销售效率的双轮驱动

目录 引言 一、AI技术在电商中的创新应用 1.1 购物推荐 1.2 会员分类 1.3 商品定价 1.4 用户体验 总结 二、AI技术提高电商平台销售效率 2.1 订单处理 2.2 物流配送 2.3 产品流转效率 2.4 库存管理和订单管理效率 2.5 实际案例分析 三、挑战和未来发展趋势 3.1…...

编程日记 2024/11/15 0:27:10

重构开发之道，Blackbox.AI为技术注入智能新动力

本文目录 一、引言二、Blackbox.AI实战体验2.1 基于网页界面生成前端代码进行应用开发2.2 与AI助手实现实时智能对话2.3 重塑大型文件交互方式2.4 链接Github仓库进行对话编程 三、总结 一、引言 在生产力工具加速进化的浪潮中&#xff0c;Blackbox.AI开始崭露头角&#xff0c…...

编程日记 2024/11/15 0:26:09

机器学习在医疗健康领域的应用

&#x1f493; 博客主页&#xff1a;瑕疵的CSDN主页 &#x1f4dd; Gitee主页&#xff1a;瑕疵的gitee主页 ⏩ 文章专栏&#xff1a;《热点资讯》 机器学习在医疗健康领域的应用 机器学习在医疗健康领域的应用 机器学习在医疗健康领域的应用 引言 机器学习概述 定义与原理 发展…...

编程日记 2024/11/15 0:25:08

M芯片Mac构建Dockerfile - 注意事项

由于MacBook的M芯片架构与intel不同&#xff0c;交叉构建Linux服务器docker镜像&#xff0c;需要以下步骤完成&#xff1a; 编写好Dockerfile在命令行中&#xff0c;执行构建命令&#xff1a; docker buildx build --platform linux/amd64 -t ${image_name}:${tag} ....

编程日记 2024/11/15 0:23:06

系统架构设计师论文

软考官网&#xff1a;中国计算机技术职业资格网 (ruankao.org.cn) 2019年 2019年下半年试题二&#xff1a;论软件系统架构评估及其应用...

编程日记 2024/11/15 0:22:05

速盾：CDN 和高防有什么区别？

在网络安全和性能优化领域&#xff0c;CDN&#xff08;Content Delivery Network&#xff0c;内容分发网络&#xff09;和高防服务是两个重要的概念&#xff0c;它们在功能、原理和应用场景方面存在诸多区别。 一、CDN &#xff08;一&#xff09;基本原理与功能 内容加速分发…...

编程日记 2024/11/15 0:20:03

goframe开发一个企业网站 rabbitmq队例15

RabbitMQ消息队列封装 在目录internal/pkg/rabbitmq/rabbitmq.go # 消息队列配置 mq:# 消息队列类型: rocketmq 或 rabbitmqtype: "rabbitmq"# 是否启用消息队列enabled: truerocketmq:nameServer: "127.0.0.1:9876"producerGroup: "myProducerGrou…...

编程日记 2024/11/15 0:19:02

设计模式-七个基本原则之一-迪米特法则 + 案例

迪米特法则:(LoD) 面向对象七个基本原则之一 只与直接的朋友通信&#xff1a;对象应只与自己直接关联的对象通信&#xff0c;例如&#xff1a;方法参数、返回值、创建的对象。避免“链式调用”&#xff1a;尽量避免通过多个对象链进行调用。例如&#xff0c;a.getB().getC().do…...

编程日记 2024/11/15 0:17:00

【数学二】线性代数-二次型

考试要求 1、了解二次型的概念， 会用矩阵形式表示二次型，了解合同变换与合同矩阵的概念. 2、了解二次型的秩的概念，了解二次型的标准形、规范形等概念，了解惯性定理，会用正交变换和配方法化二次型为标准形。 3、理解正定二次型、正定矩阵的概念，并掌握其判别法. 二次型…...

编程日记 2024/11/15 0:15:58

320页PDF | 集团IT蓝图总体规划报告-德勤（限免下载）

一、前言 这份报告是集团IT蓝图总体规划报告-德勤。在报告中详细阐述了德勤为某集团制定的全面IT蓝图总体规划&#xff0c;包括了集团信息化目标蓝图、IT应用规划、数据规划、IT集成架构、IT基础设施规划以及IT治理体系规划等关键领域&#xff0c;旨在为集团未来的信息化发展提…...

编程日记 2024/11/15 0:14:57

HTB：Sea[WriteUP]

目录 连接至HTB服务器并启动靶机 使用nmap对靶机TCP端口进行开放扫描 使用curl访问靶机80端口 使用ffuf对靶机进行了一顿FUZZ 尝试在Github上搜索版权拥有者 除了LICENSE还FUZZ出了version文件尝试访问 尝试直接在Github搜索该符合该版本的EXP 横向移动 使用john对该哈…...

编程日记 2024/11/15 0:12:55

Java 网络编程（一）—— UDP数据报套接字编程

概念 在网络编程中主要的对象有两个&#xff1a;客户端和服务器。客户端是提供请求的&#xff0c;归用户使用&#xff0c;发送的请求会被服务器接收&#xff0c;服务器根据请求做出响应&#xff0c;然后再将响应的数据包返回给客户端。 作为程序员&#xff0c;我们主要关心应…...

编程日记 2024/11/15 0:09:51

ECharts图表图例8

用eclipse软件制作动态单仪表图 用java知识点 代码截图&#xff1a;...

编程日记 2024/11/15 0:08:50

Redis中的线程模型

Redis 的单线程模型详解 Redis 的“单线程”模型主要指的是其 主线程&#xff0c;这个主线程负责从客户端接收请求、解析命令、处理数据和返回响应。为了深入了解 Redis 单线程的具体工作流程&#xff0c;我们可以将其分为以下几个步骤&#xff1a; 接收客户端请求 Redis 的主线…...

编程日记 2024/11/15 0:07:49

[产品管理-77]：技术人需要了解的常见概念：科学、技术、技能、产品、市场、商业模式、运营

目录 一、概念定义 科学 技术 技能 产品 市场 商业模式 运营 二、上述概念在产品创新中的作用 一、概念定义 对于技术人来说&#xff0c;了解并掌握科学、技术、技能、产品、市场、商业模式、运营等常见概念的定义至关重要。以下是这些概念的详细解释&#xff1a; 科…...

编程日记 2024/11/15 0:04:47

鼠标点击（一）与3D视口窗口的交互

（1） （2） （3）...

编程日记 2024/11/15 0:02:44

线程-2-线程概念与控制

main 线程常见寄存器&#xff08;CR3 EIP IR MMU TLB&#xff09; CR3是当前进程页表物理内存地址&#xff08;包不能虚拟地址&#xff0c;不然套娃了&#xff09; CPU中有寄存器指向task_struct* current EIP&#xff1a;入口虚拟地址 IR&#xff1a;当前命令地址系统总线&a…...

编程日记 2024/11/14 23:52:34

TortoiseSVN提示服务器凭证检核错误:站点名称不符

电脑重装了系统&#xff0c;下载了新版本SVN软件&#xff0c;一切准备就绪&#xff0c;准备大干一场。 打开SVN&#xff0c;一遍一遍的提示【TortoiseSVN提示服务器凭证检核错误:站点名称不符】&#xff0c;一次次的让我接受&#xff0c;终于忍受不了了。 TortoiseSVN提示服务…...

编程日记 2024/11/14 23:50:32

C++初阶-list的底层

目录 1.std::list实现的所有代码 2.list的简单介绍 2.1实现list的类 2.2_list_iterator的实现 2.2.1_list_iterator实现的原因和好处 2.2.2_list_iterator实现 2.3_list_node的实现 2.3.1. 避免递归的模板依赖 2.3.2. 内存布局一致性 2.3.3. 类型安全的替代方案 2.3.…...

编程新知 2025/8/29 21:44:33

鸿蒙中用HarmonyOS SDK应用服务 HarmonyOS5开发一个医院挂号小程序

一、开发准备 ​​环境搭建​​&#xff1a; 安装DevEco Studio 3.0或更高版本配置HarmonyOS SDK申请开发者账号 ​​项目创建​​&#xff1a; File > New > Create Project > Application (选择"Empty Ability") 二、核心功能实现 1. 医院科室展示 /…...

编程新知 2025/8/3 13:29:02

基于Uniapp开发HarmonyOS 5.0旅游应用技术实践

一、技术选型背景 1.跨平台优势 Uniapp采用Vue.js框架&#xff0c;支持"一次开发&#xff0c;多端部署"&#xff0c;可同步生成HarmonyOS、iOS、Android等多平台应用。 2.鸿蒙特性融合 HarmonyOS 5.0的分布式能力与原子化服务&#xff0c;为旅游应用带来&#xf…...

编程新知 2025/7/27 23:10:57

sqlserver 根据指定字符 解析拼接字符串

DECLARE LotNo NVARCHAR(50)A,B,C DECLARE xml XML ( SELECT <x> REPLACE(LotNo, ,, </x><x>) </x> ) DECLARE ErrorCode NVARCHAR(50) -- 提取 XML 中的值 SELECT value x.value(., VARCHAR(MAX))…...

编程新知 2025/7/27 1:33:21

C++.OpenGL （10/64）基础光照（Basic Lighting）

基础光照（Basic Lighting） 冯氏光照模型（Phong Lighting Model） #mermaid-svg-GLdskXwWINxNGHso {font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:16px;fill:#333;}#mermaid-svg-GLdskXwWINxNGHso .error-icon{fill:#552222;}#mermaid-svg-GLd…...

编程新知 2025/7/7 13:13:09

MySQL中【正则表达式】用法

MySQL 中正则表达式通过 REGEXP 或 RLIKE 操作符实现&#xff08;两者等价&#xff09;&#xff0c;用于在 WHERE 子句中进行复杂的字符串模式匹配。以下是核心用法和示例&#xff1a; 一、基础语法 SELECT column_name FROM table_name WHERE column_name REGEXP pattern; …...

编程新知 2025/7/20 8:11:39

OpenLayers 分屏对比(地图联动)

注&#xff1a;当前使用的是 ol 5.3.0 版本&#xff0c;天地图使用的key请到天地图官网申请&#xff0c;并替换为自己的key 地图分屏对比在WebGIS开发中是很常见的功能&#xff0c;和卷帘图层不一样的是&#xff0c;分屏对比是在各个地图中添加相同或者不同的图层进行对比查看。…...

编程新知 2025/8/23 21:44:50

全面解析各类VPN技术：GRE、IPsec、L2TP、SSL与MPLS VPN对比

目录 引言 VPN技术概述 GRE VPN 3.1 GRE封装结构 3.2 GRE的应用场景 GRE over IPsec 4.1 GRE over IPsec封装结构 4.2 为什么使用GRE over IPsec&#xff1f; IPsec VPN 5.1 IPsec传输模式&#xff08;Transport Mode&#xff09; 5.2 IPsec隧道模式&#xff08;Tunne…...

编程新知 2025/7/8 16:12:53

Java + Spring Boot + Mybatis 实现批量插入

在 Java 中使用 Spring Boot 和 MyBatis 实现批量插入可以通过以下步骤完成。这里提供两种常用方法&#xff1a;使用 MyBatis 的 <foreach> 标签和批处理模式&#xff08;ExecutorType.BATCH&#xff09;。 方法一&#xff1a;使用 XML 的 <foreach> 标签&#xff…...

编程新知 2025/6/11 2:44:05

数据库——redis

一、Redis 介绍 1. 概述 Redis&#xff08;Remote Dictionary Server&#xff09;是一个开源的、高性能的内存键值数据库系统&#xff0c;具有以下核心特点&#xff1a; 内存存储架构&#xff1a;数据主要存储在内存中&#xff0c;提供微秒级的读写响应 多数据结构支持&…...

编程新知 2025/7/31 10:23:08