htmlli列表项如何实现空行

大家好，我是新媒之声广告工作室的大白，今天给大家带来的是HTML5简单教学第一章（第二节）。

今天给大家带来的东西比较多；

br 换行标签实属单标签，br换行标签就如同我们编辑文本是点击的回车键，让它换到下一行。

HTML5 <br/>标签用来对文档中的文本进行换行的处理，请参考下面的这个例子：

以下代码标记一个换行：

<p> 使用 br 元素<br>在文本中<br>换行。 </p>

所有主流浏览器都支持 <br> 标签。

标签定义及使用说明

<br> 标签插入一个简单的换行符。

<br> 标签是一个空标签，意味着它没有结束标签。

提示：由于<br>标签是空标签，因此，不允许有“<br>...</br>”这样的写法！

提示和注释

提示：在写地址信息或者写诗词时 <br> 标签非常有用。

注释： 请使用 <br> 标签来输入空行，而不是分割段落。

HTML 4.01 与 HTML5之间的差异无。

HTML 与 XHTML 之间的差异

在 HTML 中，<br> 标签没有结束标签。

在 XHTML 中，<br> 标签必须被正确地关闭，比如这样：<br /> 。

nobr 不换行是属于双标签，nobr就是强制不换到下一行，在做编辑时文字或是块遇到浏览器的边会自动换到下一行使用不换行标签就强制它不让换行，这是浏览器底部就会出现航向滚动条。

p 段落标签也是属于双标签，p标签是文字标签，故名思议就是用于写文字段落的标签，p标签是属于块标签，就是独自占据一行，在下节课会介绍到块标签与行标签。

HTML5 <p>标签用于定义一个段落。

目前大多数浏览器支持 <p>标签。

标签定义及使用说明

<p> 标签定义段落。

<p>元素会自动在其前后创建一些空白。浏览器会自动添加这些空间，您也可以在样式表中规定。

提示：在本站的HTML5编程实战中，你可以练习使用<p>标签！

在HTML 4.01 与 HTML5中的差异

HTML 4.01中标签的 align 属性已经废弃，HTML5不支持该属性。

p 段落,align属性:left|center|right，是标签属性，属性有事css样式，css样式又可以通俗的理解为房子的装修，html通俗可以理解为房子的框架，div又可以通俗的理解为房子的填充砖块之类的。

所有主流浏览器都支持 align 属性。

定义和用法

HTML5 不支持 <p> align 属性。请使用 CSS 代替。

在 HTML 4.01 中，<p> 的 align 属性已废弃。

align 属性规定段落中文本的对齐方式。

兼容性注释

在 HTML 4.01 中，<p> 的 align 属性已废弃，请使用 CSS 代替。

CSS 语法：<p style="text-align:right">

CSS 实例：在段落中右对齐文本

在我们的 CSS 教程中，您可以找到更多有关 text-align 属性 的细节。

语法

<p align="left|right|center|justify">

属性值

center 居中是属于双标签，双标签就是成对出现的标签，center居中标签的意思就是让它位于浏览器的中心位置，就好比是wps的文字居中一个道理，不过居中标签是可以让它体内所有的标签都可以居中。

HTML <center> 标签 - HTML 5 不支持

<center> 标签控制文本的居中显示，不能在 HTML5 中使用。

所有主流浏览器都支持 <center> 标签。

标签定义及使用说明

HTML5 不支持 <center> 标签。请用 CSS 代替。

在 HTML 4.01 中，<center> 元素已废弃。

<center> 对其所包括的文本进行水平居中。

提示和注释

提示：请使用 CSS 样式来居中文本！在 CSS 教程中您能了解到更多关于居中文本的细节。

HTML 4.01 与 HTML5之间的差异

HTML5 不支持 <center> 标签。请用 CSS 代替。

pre 按源代码显示是属于双标签不是很常用的标签，它的意思就是让标签直接不解析让浏览器表现出来，一般用于展示源代码。

HTML <pre> 标签

<pre> 标签可以保留您需要的文本格式，比如不会取消换行和空格，并且所示文本是等宽的。

目前大多数浏览器支持 <pre> 标签。

标签定义及使用说明

<pre> 标签可定义预格式化的文本。

被包围在 <pre> 标签 元素中的文本通常会保留空格和换行符。而文本也会呈现为等宽字体。

注意：<pre> 元素是块级元素，但是只能包含文本或行内元素，任何块级元素（常见为可以导致段落断开的标签：例如<title>、<p> 和<address> 标签）都不能位于 <pre> 元素中。

提示和注释

提示: <pre> 标签的一个常见应用就是用来表示计算机的源代码。

提示：<pre> 标签与 <code> 标签结合起来使用，可以获得更加精确的语义。

在HTML 4.01 与 HTML5中的差异

在 HTML 4.01 中，"width" 属性已废弃，不可使用。 HTML5 不支持"width"属性。

属性

全局属性

<pre> 标签支持全局属性，查看完整属性表 HTML全局属性。

ul 无序列表属于双标签，一般配合li标签使用，无序列表属和wps中表现是一样的不过无序列表中不只可以写文字和数字也可以写div之类的标签有的网页导航就是用ul无序列表标签写出来的。

HTML <ul> 标签

<ul> 标签表示HTML页面中项目的无序列表，一般会以项目符号列表呈现

所有主流浏览器都支持 <ul> 标签。

标签定义及使用说明

<ul> 标签定义无序列表。

将 <ul> 标签与 <li> 标签一起使用，创建无序列表。

提示和注释

提示：使用 CSS 为列表定义样式。

提示：使用 <ol> 标签创建有序列表。

HTML 4.01 与 HTML5之间的差异

在 HTML 4.01 中，"compact" 和 "type" 属性已废弃。HTML5 则不支持着两个属性。

属性

ol 有序列表标签和ul无序列表标签是一个道理，也是配合li标签使用唯一区别就是一个前面带点一个前面带阿拉伯数字。

HTML <ol> 标签

<ol> 标签在 HTML 中表示有序列表，是 ordered lists 的缩写。您可以自定义有序列表的初始序号

目前大多数浏览器支持 <ol> 标签。

标签定义及使用说明

<ol> 标签定义了一个有序列表. 列表排序以数字来显示。

使用<li> 标签来定义列表选项。

提示和注释

提示： 如果需要无序列表，请使用 <ul> 标签。

提示：使用 CSS 来定义列表样式。

HTML 4.01 与 HTML5中的差异

在 HTML 4.01 中"start" 和 "type" 属性已经废弃，HTML5不支持该属性。

"reversed" 属性是 HTML5 中的新属性。

在HTML 4.01中"compact" 属性已经废弃,在 HTML5中不支持该属性。

属性

New：HTML5 新属性。

dl 自定义列表 dt 自定义标题 dd 自定义列表内容这三个标签我放在一起讲因为这三个标签是配合在一起的用法和ul标签ol标签差不多，就不再过多的叙述了，一般用到的不是很多。

所有主流浏览器都支持 <dl> 标签。

标签定义及使用说明

<dl> 标签定义一个描述列表。

<dl> 标签与 <dt> （定义项目/名字）和 <dd> （描述每一个项目/名字）一起使用。

HTML 4.01 与 HTML5之间的差异

在 HTML 4.01 中，<dl> 标签定义一个定义列表。

在 HTML5 中，<dl> 标签定义一个描述列表。

HTML <dt> 标签

<dt> 标签只能够作为 <dl> 标签的一个子元素出现，常常后跟一个 <dd> 标签。

所有主流浏览器都支持 <dt> 标签。

标签定义及使用说明

• <dt> 标签定义一个描述列表的项目/名字。

  <dt> 标签与 <dl> （定义一个描述列表）和 <dd> （描述每一个项目/名字）一起使用。

  一行中的多个 <dt> 标签表示由紧邻的下一个 <dd> 元素定义的多个术语。

• ---

HTML 4.01 与 HTML5之间的差异

在 HTML 4.01 中，<dt> 标签定义一个定义列表的条目。

在 HTML5 中，<dt> 标签定义一个描述列表的项目/名字。

hr 导航线这节课最后一个标签是单标签，所谓的导航线不过就是一条横线用来分割。

HTML <hr> 标签

<hr> 标签表示段落级元素之间的主题划分。

所有主流浏览器都支持<hr> 标签。

标签定义及使用说明

<hr>标签定义HTML页面中的主题变化（比如话题的转移），并显示为一条水平线。 元素被用来分隔HTML页面中的内容（或者定义一个变化）。

HTML 4.01与HTML5之间的差异

在HTML5中，<hr> 定义内容中的主题变化，并显示为一条水平线。

在HTML 4.01中，<hr> 标签仅仅显示为一条水平线。

在HTML 4.01中，的所有布局属性都已废弃。在HTML5中不再支持这些属性。请使用CSS来为<HR> 元素定义样式。

HTML与XHTML之间的差异

在HTML中，<hr> 标签没有结束标签。

在XHTML中，<hr> 标签必须被正确地关闭，比如<hr /> 。

属性

谢谢大家的观看，如果需要今天课程的源代码和ppt可以私信给我，我会免费发给你，最好使能够关注小编一下。