37-无序列表

news/2024/11/25 7:35:59/

2.列表标签

表格是用来显示数据的,那么列表就是用来布局的

列表最大的特点就是整齐、整洁、有序,它作为布局会更加自由和方便。

根据使用场景不同,列表可以分为三大类:无序列表、有序列表自定义列表。

无序列表:
在这里插入图片描述

有序列表:
在这里插入图片描述
自定义列表:

在这里插入图片描述

2.1无序列表(重点)

<ul>标签表示HTML页面中项目的无序列表,一般会以项目符号呈现列表项,而列表项使用<li>标签定义。

无序列表的基本语法格式如下:

<ul><li>列表项1</li><li>列表项2</li><li>列表项3</li>...
</ul>

示例:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><h4>您喜欢的食物?</h4><ul><li>榴莲</li><li>菠萝蜜</li><li>山竹</li><li>饺子</li></ul>
</body>
</html>

注意点:
1.无序列表的各个列表项之间没有顺序级别之分,是并列的。
2.<ul></ul>中只能嵌套<li></li>,直接在<ul></ul>标签中输入其他标签或者文字的做法是不被允许的。
3.<li>与</li>之间相当于一个容器,可以容纳所有元素。
4.无序列表会带有自己的样式属性,但在实际应用时,我们会使用CSS来设置。


http://www.ppmy.cn/news/301917.html

相关文章

567. 字符串的排列

给定两个字符串 s1 和 s2&#xff0c;写一个函数来判断 s2 是否包含 s1 的排列。 换句话说&#xff0c;第一个字符串的排列之一是第二个字符串的子串。 示例1: 输入: s1 "ab" s2 "eidbaooo" 输出: True 解释: s2 包含 s1 的排列之一 ("ba")…

7-46-7-50

7-46 输出下半张九九乘法表 (10 分) 请输出下半张九九乘法表&#xff0c;即下三角的半张。 11 1 21 2 22 4 31 3 32 6 33 9 41 4 42 8 4312 4416 51 5 5210 5315 5420 5525 61 6 6212 6318 6424 6530 6636 71 7 7214 7321 7428 7535 7642 7749 81 8 8216 8324 8432 85…

RS422与RS485

RS422与RS485 1> 2线-RS485电路2> RS485波形3> 思考4> 4线-RS485电路5> RS422电路 1> 2线-RS485电路 2> RS485波形 &#x1f517; RS485波形记录与分析 实测波形&#xff1a;芯片,ISO1500; &#x1f517; WFM阅读器 测量注意&#xff1a; 正确接地&#…

lc567.字符串的排列

给你两个字符串 s1 和 s2 &#xff0c;写一个函数来判断 s2 是否包含 s1 的排列。如果是&#xff0c;返回 true &#xff1b;否则&#xff0c;返回 false 。 换句话说&#xff0c;s1 的排列之一是 s2 的 子串 。 例 1&#xff1a; 输入&#xff1a;s1 "ab" s2 &…

567.字符串的排列

难度&#xff1a;中等 目录 一、问题描述 二、解题思路 1、思路 三、解题 1、代码实现 2、时间复杂度 and 空间复杂度 一、问题描述 这里直接采用LeetCode上面的问题描述。 给你两个字符串 s1 和 s2 &#xff0c;写一个函数来判断 s2 是否包含 s1 的排列。如果是&#…

backtrack3安装使用教程

一、准备篇 1、一个有可破解无线信号的环境。如我在家随便搜索出来的信号。 2、带无线网卡的电脑一台&#xff08;笔记本台式机均可&#xff0c;只要无线网卡兼容BT3&#xff09;&#xff0c;我用的是三星R467的上网本。  3、2G以上优盘一个&#xff08;我用的是2G的&#x…

【Spring源码解读三】IoC容器之AnnotationConfigApplication的refresh()刷新方法其二

invokeBeanFactoryPostProcessors() PriorityOrdered接口 Ordered接口 invokeBeanDefinitionRegistryPostProcessors() registerBeanPostProcessors() getBeanNamesForType() initMessageSource() initApplicationEventMulticaster() onRefresh() registerListeners()…

云台和华为p30pro_Vlog利器 大疆新微单云台2299元!买!必须买!

01大疆新微单云台2299元&#xff01; 大疆创新通过线上发布的方式正式发布如影Ronin-SC云台(简称如影SC)&#xff0c;单手持微单稳定器如影SC&#xff0c;如影SC专为微单相机打造&#xff0c;轻巧便携的机身集成了强大的产品性能&#xff0c;而如影系列在视频行业中拥有大批的粉…