HTML之列表学习记录

server/2024/11/14 19:18:05/
htmledit_views">

练习题:

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

58cc72ec33694acab65dde7a953047f7.png

代码:

html"><!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

练习过程的代码:

 

html"><!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

 


http://www.ppmy.cn/server/141934.html

相关文章

自动化测试工具Ranorex Studio(三十二)-阅读RANOREX报告

在Ranorex Studio执行测试套件后&#xff0c;生成的报告文件以文件视图打开&#xff0c;如下图所示。 运行测试套件后的Ranorex报告 该报告在运行测试套件后&#xff0c;提供了一个通用的概述&#xff0c;多少测试用例执行成功&#xff0c;失败或被中断。 每个执行的测试用例及…

【网络安全】记一次APP登录爆破

使用工具 安卓12 jadx-gui 抓取登录HTTP请求包 安装burp证书&#xff0c;并抓取登录请求。 POST /loginUser HTTP/1.1 Host: api.xxxx.xxxxx.comapiaccountvrpuc-aaf91f835147ce2d01216bd3bd5c3516&phonexxxx&sign72C132B392873B3F4F6C0872E5EC4B5A&encM%2F8h…

单片机中的BootLoader(重要的概念讲解)

文章目录 一、链接地址和执行地址1. 链接地址(Load Address)2. 执行地址(Execution Address)链接地址与执行地址的关系实际工作流程总结二、相对跳转和绝对跳转1. 相对跳转(Relative Jump)2. 绝对跳转(Absolute Jump)3. `BX` 和 `BL` 指令总结三、散列文件1. 散列文件的…

【论文阅读】小样本学习相关研究

相关文献 Generalizing from a Few Examples: A Survey on Few-Shot Learning Author: YAQING WANG、QUANMING YAO、JAMES T. KWOK、LIONEL M. NIAbstract: Artificial intelligence succeeds in data-intensive applications, but it lacks the ability of learning from a …

2024-09-01 - 分布式集群网关 - LoadBalancer - 阿里篇 - 流雨声

摘要 通过公有云部署创建类似 MateLB 的应用负载&#xff0c;可以更加方便的对系统资源进行合理规划。 应用实践 CCM提供Kubernetes与阿里云基础产品&#xff08;例如CLB、VPC等&#xff09;对接的能力&#xff0c;支持在同一个CLB后端挂载集群内节点和集群外服务器&#xf…

力扣 LeetCode 977. 有序数组的平方(Day1:数组)

解题思路&#xff1a; 方法一&#xff1a;先平方再快排 方法二&#xff1a;双指针 因为可能有负数&#xff0c;所以对于一个数组 [ -5 , -3 , 0 , 2 , 4 ] 可以从两边向内靠拢&#xff0c;最大值一定出现在两端 设置指针 i 和指针 j 分别从左右两边靠拢 因为要从小到大排序…

新手小白学习docker第六弹------Docker常规安装(安装tomcat、mysql、redis)

目录 1 总体步骤2 安装tomcat2.1 搜索镜像2.2 拉取镜像2.3 查看镜像2.4 启动镜像2.5 访问猫首页 3 安装mysql3.1 搜索镜像3.2 拉取镜像3.3 启动镜像 4 安装redis4.1 拉取镜像4.2 启动镜像&#xff08;法1基础版&#xff09;4.3 配置文件4.3.1 在宿主机下新建目录 /app/redis4.3…

Jmeter中的配置原件(一)

配置原件 1--CSV Data Set Config 用途 参数化测试&#xff1a;从CSV文件中读取数据&#xff0c;为每个请求提供不同的参数值。数据驱动测试&#xff1a;使用外部数据文件来驱动测试&#xff0c;使测试更加灵活和可扩展。 配置步骤 准备CSV文件 创建一个CSV文件&#xff0c…