`
oywl2008
  • 浏览: 1083256 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

HTML列表(Lists)

 
阅读更多

HTML有三种列表形式:排序列表(Ordered List);不排序列表(Unordered List);定义列表(Definition List)。

排序列表(Ordered List)

排序列表中,每个列表项前标有数字,表示顺序。

排序列表由<ol>开始,每个列表项由<li>开始。

排序列表示例

不排序列表(Unordered List)

不排序列表不用数字标记每个列表项,而采用一个符号标志每个列表项,比如圆黑点。

不排序列表由<ul>开始,每个列表项由<li>开始。

不排序列表示例

定义列表

定义列表通常用于术语的定义。

定义列表由<dl>开始。术语由<dt>开始,英文意为Definition Term。术语的解释说明,由<dd>开始,<dd></dd>里的文字缩进显示。

定义列表示例

更多示例

不同类型(Type)的排序列表

这个例子显示如何用Type属性设置排序列表项前的符号。

不同类型(Type)的不排序列表

这个例子显示如何用Type属性设置不排序列表项前的符号。

嵌套的列表

列表里可以含有子列表。通常用这种嵌套的列表,反映层次较多的内容。

 

 

 

 

http://www.admin5.com/html/html_tutorials/035_html_list.html

 

 

分享到:
评论

相关推荐

    styleable-lists:轻松设置HTML列表项目符号和有序列表编号的样式,而不会影响正文

    CSS库的styleable-lists可以轻松设置HTML列表项目符号和数字的样式,而不会影响正文。 只需将样式放在li:before选择器和vola自定义项目符号上即可。 观察下面的示例,在该示例中,我们选择将ul li符号和ol li数字...

    jquery-sortable-lists, 用于排序列表的jQuery插件还包括树结构.zip

    jquery-sortable-lists, 用于排序列表的jQuery插件还包括树结构 jquery-sortable-lists用于排序列表的插件还包括树结构。$('#myList').sortableLists( options );你可以通过鼠标对html列表的项进行排序。 创建树结构...

    HTML5基础知识-HTML5表格与列表.pptx

    在HTML5中,表格(tables)和列表(lists)有着丰富的功能和样式设定,使得开发者能够创建出结构清晰、视觉效果良好的网页。 首先,我们来探讨HTML5中的表格。表格通过`&lt;table&gt;`标签创建,它由多个部分组成,包括...

    前端项目-angular-drag-and-drop-lists.zip

    前端项目-angular-drag-and-drop-lists,Angular directives for sorting nested lists using the HTML5 Drag and Drop API

    HTML - Beginners-Guide-to-HTML - Michael Gabriel

    1. Getting Started: What You Need to Do to Get Going and Make Your ...4. Unnumbered, Numbered, Definition and Nested Lists 4.1 Ordered lists 4.2 Unordered lists 4.3 Description lists 4.4 Nested lists ...

    Dynamic Option Lists

    【标题】"动态选项列表"(Dynamic Option Lists)是一种网页设计技术,主要用于创建交互式的下拉选择菜单。这种技术能够实现下拉框之间的级联效果,即在一个下拉框的选择改变时,根据所选值动态更新另一个下拉框的...

    网页设计与制作列表与框架PPT学习教案.pptx

    在HTML中,列表分为两类:有序列表(ordered lists)和无序列表(unordered lists)。有序列表通常用于展示有顺序的信息,例如步骤或排名。其基本格式如下: ```html &lt;li&gt; 列表项 1 &lt;li&gt; 列表项 2 ... &lt;li&gt; ...

    认识HTML语言 认识HTML语言

    - **列表(Lists)**:有序列表(`&lt;ol&gt;`)和无序列表(`&lt;ul&gt;`)。 - **图片(Images)**:使用`&lt;img&gt;`标记。 - **链接(Links)**:使用`&lt;a&gt;`标记。 #### 8. HTML标记类型 - **单标记**:如` `用于换行,`&lt;hr&gt;`...

    angular-drag-and-drop-lists:使用HTML5拖放API对嵌套列表进行排序的Angular指令

    Angular指令,允许您使用本机HTML5拖放API构建可排序的列表。 指令也可以嵌套以将拖放拖放到所见即所得编辑器,树或正在构建的任何奇特结构中。 :warning: 停产通知 该库是为处于 AngularJS 1.x构建的。 我建议迁移...

    35个静态HTML个人简历模板

    5. **列表(Lists)**:有序列表(ol)和无序列表(ul)用于呈现项目或技能。 6. **链接(Links)**:使用`&lt;a&gt;`标签创建超链接,指向其他网页或文件。 7. **图像(Images)**:使用`&lt;img&gt;`标签添加图片,通常用于...

    HTML中文API

    6. **列表(Lists)**:`&lt;ul&gt;`(无序列表)和`&lt;ol&gt;`(有序列表)元素用于创建列表,`&lt;li&gt;`定义列表项。 7. **图像(Images)**:`&lt;img&gt;`元素插入图片,`src`属性指定图片源,`alt`属性提供替代文本。 8. **链接...

    HTML基础教程文档

    框架(Frames)允许在一个浏览器窗口中同时显示多个页面,表格(Tables)用于组织数据,列表(Lists)分为有序、无序和定义列表三种类型。HTML表单(Forms)用于收集用户输入,图像(Images)通过`&lt;img&gt;`标签插入,...

    HTML10笔记.pdf

    * lists(列表):ul、ol、dl * tables(表格):table * forms(表单):form * frames(框架):frame HTML10属性 HTML10的属性用于描述标签的行为和样式。常用的属性包括: * id:用于指定唯一的标识符 * ...

    2023仿番茄小说html基本大作业3页(首页+列表+详情)

    其次,`lists_article.htm`是列表页,展示了一系列小说的标题、作者、简介等信息。在HTML中,可以使用`&lt;ul&gt;`和`&lt;li&gt;`来创建无序列表,每个列表项可能包含`&lt;h2&gt;`或`&lt;h3&gt;`标题,`&lt;p&gt;`段落用于介绍,以及`&lt;a&gt;`标签指向...

    html-fundamentals-html-lists-lab-atlanta-web-033020

    HTML列表学习目标识别无序和有序HTML列表创建无序列表识别有序列表标签创建有序列表介绍许多HTML标记以独特的方式运行。 有些应用自动样式设置,例如p标签可在文本周围创建边距。 有些,例如标题标签,会增加字体...

    ngx-drag-and-drop-lists:列表的角度拖放组件

    Angular指令,允许您使用本机HTML5拖放API构建可排序的列表。 指令也可以嵌套以将拖放拖放到所见即所得编辑器,树或正在构建的任何奇特结构中。 归功于原始创作者 该库的灵感来自以AngularJS编写的库。 拖动元素...

    HTML&CSS 设计与构建网站_PDF电子书下载 带书签目录 完整版

    8. **列表(Lists)**:`&lt;ul&gt;`和`&lt;ol&gt;`创建无序和有序列表,`&lt;li&gt;`定义列表项。 9. **表格(Tables)**:`&lt;table&gt;`、`&lt;tr&gt;`、`&lt;th&gt;`和`&lt;td&gt;`用于创建表格。 10. **表单(Forms)**:`&lt;form&gt;`、`&lt;input&gt;`、`...

    HTML5+CSS3网页设计-第二章 列表表格与媒体元素.pptx

    **列表(Lists)** HTML5提供了三种类型的列表:无序列表(`&lt;ul&gt;`)、有序列表(`&lt;ol&gt;`)和定义列表(`&lt;dl&gt;`)。无序列表通常用圆点或项目符号表示,适合展示无需特定顺序的信息,如导航菜单。有序列表则用数字或字母...

    html-fundamentals-html-lists-lab-online-web-prework

    HTML列表学习目标识别无序和有序HTML列表创建无序列表识别有序列表标签创建有序列表介绍许多HTML标记以独特的方式运行。 有些应用自动样式设置,例如p标签可在文本周围创建边距。 有些,例如标题标签,会增加字体...

    10张HTML知识脑图,手慢无!

    6. **列表(Lists)** HTML提供两种类型的列表:有序列表`&lt;ol&gt;`和无序列表`&lt;ul&gt;`。每个列表项用`&lt;li&gt;`元素表示。 7. **区块元素与内联元素** 区块元素如`&lt;div&gt;`和`&lt;p&gt;`会自动在前后添加换行,而内联元素如`&lt;span&gt;...

Global site tag (gtag.js) - Google Analytics