先复习下上一节

<!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. IDEA 新建 module

    maven项目可以创建多个module,在IDEA中具体操作 1.在已经建好的maven项目上右键 2.新建: 效果如下: 这时在子pom.xml中 <parent> <artifa ...

  2. 【HDU3595】GG and MM（博弈论）

    [HDU3595]GG and MM(博弈论) 题面 HDU 一个游戏由多个游戏组成,每次每个操作者必须操作所有可以操作的游戏,操作集合为空者输. 每个游戏由两堆石子组成,每次可以从较多的那一堆中取走 ...

  3. 2018-2019 ACM-ICPC Pacific Northwest Regional Contest C Contest Setting（DP）

    比赛链接:Contest Setting C题 题意:$n$道题目,每道题目难度为$ai$,选择$k$道难度不同的题目,有多少种选择方案.$1<=k<=n<=1000,1<=a ...

  4. bzoj2288 生日礼物 (线段树)

    我当然想选最大的子段和啦 但要选M次 那不一定就是最好的 所以提供一个反悔的选项,我选了一段以后,就把它们乘个-1,然后再选最好的(类似于网络流的思路) 这个可以用线段树来维护,记一个区间包含左端点/ ...

  5. [APIO/CTSC 2007]数据备份（贪心+堆）

    你在一家 IT 公司为大型写字楼或办公楼(offices)的计算机数据做备份.然而数据备份的工作是枯燥乏味的,因此你想设计一个系统让不同的办公楼彼此之间互相备份,而你则坐在家中尽享计算机游戏的乐趣. ...

  6. CDQ分治与整体二分学习笔记

     CDQ分治部分 CDQ分治是用分治的方法解决一系列类似偏序问题的分治方法,一般可以用KD-tree.树套树或权值线段树代替. 三维偏序,是一种类似LIS的东西,但是LIS的关键字只有两个,数组下标和 ...

  7. mysql5.6做单向主从复制Replication

    原理场景:MySQL从3.23版本开始提供复制功能.指的是将主数据库的DDL和DML操作通过二进制日志传到从服务器(也叫从库),然后在从库上对这些日志重新执行, 从而使得从库和主库的数据保持同步. 优 ...

  8. 从Java的角度修复文件下载漏洞

    从Java的角度谈下文件下载漏洞的产生,然后到他的修复方案.这里我的修复方案是白名单,而没有采用黑名单的方式. 首先先看一段存在文件下载漏洞的代码code: HTML视图页面  download.ht ...

  9. 洛谷P2762 太空飞行计划问题

    这题套路好深......没想渠. 题意:给你若干个设备,若干个任务. 每个任务需要若干设备,设备可重复利用. 完成任务有钱,买设备要钱. 问最大总收益(可以什么任务都不做). 解:最大权闭合子图. 对 ...

  10. A1115. Counting Nodes in a BST

    A Binary Search Tree (BST) is recursively defined as a binary tree which has the following propertie ...