先复习下上一节

<!doctype html>

<html>

<head>

    <meta charset="utf-8">

    <title>练习</title>

</head>

<body>

    <h1>This is heading one</h1>

    <hr/>

    <p>这是一个段落，上下皆有一个水平线</p>

    <hr/>

    <h2>This is heading two</h2>

    <p>接下来有一个换行<br/>换行咯</p>

    <h3>This is heading three</h3>

    <p>领略一下<font size="+8" face="楷体" color="blue">font</font>标签的作用吧！</p>

    <h4>This is heading four</h4>

    <b>b标签是加粗哦！</b>

    <h5>This is heading five</h5>

    <i>i标签是变斜体</i>

    <u>u标签是加下划线</u>

    <s>s是加删除线</s>

    <big>big呈现大号字体效果</big>

    <small>small呈现小号字体效果</small>

    <p><font size="22">五的二次方<sup>二</sup></font>碳<sub>十四</sub></p>

    <h6>This is heading six</h6>

</body>

</html>

HTML 列表标签支持有序、无序和定义列表。

列表标签表格：

1.无序列表

　　无序列表是一个项目的列表。无序列表项开始于 <ul> 标签，结束于</ul>标签。每个列表项开始于 <li>标签，结束于</li>标签。列表项内部可以使用段落、换行符、图片、链接以及其他列表等等。在这里只是最基础的文字来演示。

<!doctype html>

<html>

<head>

    <meta charset="utf-8">

    <title>列表标签演示</title>

</head>

<body>

    <h1>这是一个无序列表标签演示</h1>

    <ul<!--unOrderList-->

        <li>苹果</li>

        <li>香蕉</li>

        <li>葡萄</li>

        <li>西瓜</li>

        <li>荔枝</li>

    </ul>

</body>

</html>

2.有序列表

　　同样，有序列表也是一列项目，列表项目使用数字，字母等进行标记。有序列表开始于 <ol> 标签，结束于</ol>标签。每个列表项始于 <li> 标签，结束于</li>标签。列表项内部可以使用段落、换行符、图片、链接以及其他列表等等。

<!doctype html>

<html>

<head>

    <meta charset="utf-8">

    <title>列表标签演示</title>

</head>

<body>

    <h1>这是一个有序列表标签演示</h1>

    <ol type="a"><!--orderList利用标签的属性设置属性值，从a开始增长-->

        <li>苹果</li>

        <li>香蕉</li>

        <li>葡萄</li>

        <li>西瓜</li>

        <li>荔枝</li>

    </ol>

</body>

</html>

<!doctype html>

<html>

<head>

    <meta charset="utf-8">

    <title>列表标签演示</title>

</head>

<body>

    <h1>这是一个有序列表标签演示</h1>

    <ol type="1"><!--利用标签的属性设置属性值，从1开始自增长-->

        <li>苹果</li>

        <li>香蕉</li>

        <li>葡萄</li>

        <li>西瓜</li>

        <li>荔枝</li>

    </ol>

</body>

</html>

3.定义列表

自定义列表不仅仅是一列项目，而是项目及其注释的组合。自定义列表以 <dl> 标签开始，结束于</dl>标签。每个自定义列表项以 <dt> 开始，结束于</dt>标签。每个自定义列表项的定义以 <dd> 开始，结束于</dd>标签。定义列表的列表项内部可以使用段落、换行符、图片、链接以及其他列表等等。

<!doctype html>

<html>

<head>

    <meta charset="utf-8">

    <title>列表标签演示</title>

</head>

<body>

    <h1>这是一个定义列表标签演示</h1>

    <!--HTML注释：演示列表标签

    列表标签：dl

    上层项目：dt

    下层项目：dd    封装的内容在显示时会缩进的，有自动缩进现象

    -->

    <dl>

        <dt>游戏名称:</dt>

        <dd>魂斗罗</dd>

        <dd>超级玛丽</dd>

        <dd>冒险岛</dd>

        <dd>热血格斗</dd>

        <dd>忍者神龟</dd>

    </dl>

</body>

</html>

4.

5.

6.

7.

8.

9.

10.

11.

12.

13.

HTML第二耍 列表标签的更多相关文章

  1. HTML第三耍 图像标签

    复习一下第二耍: <!doctype html> <html> <head> <meta charset="utf-8"> < ...

  2. H5的段落标签、图片标签、列表标签与链接标签

    段落标签 (1)<p>段落标签</p> (2)<nobr>强制不换行标签,会出现滚动条</nobr> (3)<pre>保留原始排版标签< ...

  3. 5.22 HTML 列表标签和表单标签

    1,ul无序列表 标签 ul:unordered list ,就是无序列表的意思. li:  listitem  列表项的意思.无序列表的每一项都是<li>. <!DOCTYPE h ...

  4. python 全栈开发，Day46(列表标签,表格标签,表单标签,css的引入方式,css选择器)

    一.列表标签 列表标签分为三种. 1.无序列表<ul>,无序列表中的每一项是<li> 英文单词解释如下: ul:unordered list,“无序列表”的意思. li:lis ...

  5. 前端基础-html 列表标签,表格标签,表单标签

    一.列表标签 1.ul(无序列表)标签 ul(unordered list)无序列表,ul下的子元素只能是li(list item),如下示例: <ul> <li>第一项< ...

  6. Day46（列表标签，表格标签，表单标签，css的引入方式，css选择器）

    一.列表标签 列表标签分为三种. 1.无序列表<ul>,无序列表中的每一项是<li> 英文单词解释如下: ul:unordered list,“无序列表”的意思. li:lis ...

  7. HTML（标题/图片/链接/列表标签）

    <!DOCTYPE html> 声明 <!DOCTYPE html> 是 html5 标准网页声明,全称为 Document Type HyperText Mark-up La ...

  8. HTML的表格标签，列表标签，表单标签，HTML5有哪些新特性

    欢迎大家去博客冰山一树Sankey,浏览效果更好.直接右上角搜索该标题即可 博客园主页:博客园主页-冰山一树Sankey CSDN主页:CSDN主页-冰山一树Sankey 前端学习:学习地址:黑马程序 ...

  9. 初学HTML 常见的标签(二) 列表标签

    上次介绍了一些简单的文本标签设计, 这篇介绍列表类标签, 通过列表能写出很好看的, 多元化的网络页面. ul-li 列表标签 <ul> <li>列表1</li> & ...

随机推荐

  1. 【XSY2741】网格 分治 LCT 并查集

    题目描述 有一个\(n\times m\)的网格,线框的交点可以扭动,边不可伸缩.网格中有一些格子里面放了'x'形的支架,这些格子不会变形,但可以整体转动.如果所有格子都不能变形,那么称这个网格稳固. ...

  2. 基于 __new__ 方法的单例模式

    单例模式定义 首次实例化创建实例化对象 之后的每次实例化都用最初的实例化对象 即单实例模式 __new__ 的原理 __new__ 方法可以在 __init__ 方法执行 这样可以在初始化之前进行一系 ...

  3. windows下操作linux虚拟机映射网络驱动器中文件提示chmod权限不足解决方案

    为了方便操作,linux虚拟机会通过windows下连接网络驱动器的方式共享自己的文件,对于前端来说,我想把gulp放在windows磁盘,操作虚拟机中的php文件,一来节省虚拟机磁盘大小,二来解决虚 ...

  4. python3 列表list

    列表用中括号表示[]: list()创建一个列表: 是可变的: 可以被迭代,也可以被切片: +组合列表,*重复列表: 可以使用del删除元素,del L[index]; 方法: append(obj) ...

  5. Luogu P5285 / LOJ3050 【[十二省联考2019]骗分过样例】

    伪提答害死人...(出题人赶快出来挨打!!!) 虽说是考场上全看出来是让干嘛了,然而由于太菜以及不会打表所以GG了,只拿了\(39\)... 经测试,截至\(2019.4.18-11:33\),这份接 ...

  6. Dos 批处理 Shutdown

    第一步: win + R,打开"运行" 第二步: 输入cmd 第三步: 输入color a或color b改成自己喜欢的颜色 第四步: 在shutdown后面输入不同的命令达到不同 ...

  7. 【CF600E】Lomsat gelral

    题目大意:给定一棵 N 个节点的有根树,1 号节点是树的根节点,每个节点有一个颜色.求对于每个节点来说,能够支配整棵子树的颜色之和是多少.支配的定义为对于以 i 为根的子树,该颜色出现的次数不小于任何 ...

  8. jenkins系列之添加全局配置(一)

    第一步: 第二步:执行以下命令: 第三步:找到/c/Users/Administrator/.ssh 目录,里面有两个文件:id_rsa和id_rsa.pub 第四步:配置ssh[这里是id_rsa. ...

  9. CSUST 1011 神秘群岛 (Dijkstra+LCA)

    神秘群岛   Description 小J继续着周游世界的旅程,这次他来到了一个神奇的群岛.这片群岛有n个岛屿,同时这些岛屿被标上了1-n的编号. 每个岛屿上面都有神奇的传送门,传送门可以把小J从当前 ...

  10. Failed to start Vsftpd ftp daemon错误

    配置 vsftpd.conf文件后 重启ftp服务出现 Failed to start Vsftpd ftp daemon错误 总是 启动失败 解决方法 将配置文件中的 listen=YES 改为 l ...