【学习笔记】html基础知识第二更/标签详解①

<p>标签，添加段落
如果想在网页上显示文章，这时就需要<p>标签了，把文章的段落放到<p>标签中。
语法：
<p>段落文本</p>

注意一段文字一个<p>标签，如在一篇新闻文章中有3段文字，就要把这3个段落分别放到3个<p>标签中。

<p>标签的默认样式，是段前段后都会有空白，可以用css样式来删除或改变标签的默认样式。

特别强调-<em>/<strong>标签
但两者在强调的语气上有区别:<em> 表示强调，<strong> 表示更强烈的强调。并且在浏览器中<em> 默认用斜体表示，<strong> 用粗体表示。两个标签相比，目前国内前端程序员更喜欢使用<strong>表示强调。
语法：
<em>需要强调的文本</em>
<strong>需要强调的文本</strong>

如，在网上商城中，某产品的打折后的价格是需要强调的。
<em>的内容在浏览中显示为斜体，<strong>显示为加粗。对于所有你不喜欢的默认样式，都可以在css中改变它。

<span>标签与<em>/<strong>的区别

1. <em>和<strong>标签是为了强调一段话中的关键字时使用，它们的语义是强调。
2. <span>标签是没有语义的，它的作用就是为了设置单独的样式用的。

当只是想为一段文字设置和其它文字不同的样式（而不是为了强调），这种情况下就可以用到<span>标签了。

< q>标签，在你的html中加一段引用
比如在你的网页的文章里想引用某个作家的一句诗，这样会使你的文章更加出彩，那么<q>标签是你所需要的。
语法：
<q>引用文本</q>

1. 如果你需要引用一段话，而这并不是作者自己的文字，这个时候你需要使用<q></q>实现引用。
2. 注意要引用的文本不用加双引号，浏览器会对q标签自动添加双引号。

<blockquote>标签，长文本引用
<blockquote>的作用也是引用别人的文本。但它是对长文本的引用，如在文章中引入大段某知名作家的文字，这时需要这个标签。
区别：<q>标签是对简短文本的引用，比如说引用一句话就用到<q>标签。
而当引用文本比较长，就应该使用<blockquote>。

语法:
<blockquote>引用文本</blockquote>
浏览器对<blockquote>标签的解析是缩进样式。

如何加入一个折行-<br />标签
在需要加回车换行的地方加入<br />，<br />标签作用相当于word文档中的回车。语法：
xhtml1.0写法：
<br />
html4.01写法：
<br>
现在一般使用 xhtml1.0 的版本的写法（其它标签也是），这种版本比较规范。

  与以前我们学过的标签不一样，<br />标签是一个空标签，没有HTML内容的标签就是空标签，空标签只需要写一个开始标签，这样的标签有<br />、<hr />和<img />。
  很遗憾，在 html 中是忽略回车和空格的，你输入的再多回车和空格也显示不出来，所以需要折行的时候必须使用<br/>标签。

为你的网页中添加一些空格
之前我们已经讲解过在html代码中输入空格、回车都是没有作用的。要想输入空格，必须写入空格占位符
语法：&n.b.s.p;（注意，实际使用时无须小数点，此处每个字符间隔加入“.”是为了避免被吞）
 

认识<hr>标签，添加水平横线
在信息展示时，有时会需要加一些用于分隔的横线，这样会使文章看起来整齐些。
语法：
html4.01版本 <hr>
xhtml1.0版本 <hr />

注意：

1. <hr />标签和<br />标签一样也是一个空标签，所以只有一个开始标签，没有结束标签。
2. <hr />标签的在浏览器中的默认样式线条比较粗，颜色为灰色，可能有些人觉得这种样式不美观，没有关系，这些外在样式在我们以后学习了css样式表之后，都可以对其修改。
3. 现在一般使用 xhtml1.0 的版本，这种版本比较规范。

<address>标签，为网页加入地址信息
一般网页中会有一些网站的联系地址信息需要在网页中展示出来，这些联系地址信息如公司的地址就可以<address>标签。也可以定义一个地址（比如电子邮件地址）、签名或者文档的作者身份。
语法：
<address>联系地址信息</address>

如：
<address>文档编写：lilian 北京市西城区德外大街10号</address>
在浏览器上显示的样式为斜体，同样的，如果不喜欢这种默认的效果，可以在后面学习了css样式之后，去改变它。

<code>标签-加入一行代码
当你需要在网页中加入一行代码的时候，你就可以使用<code>标签了，如下：
<code>var i=i+300;</code>
注意：在文章中一般如果要插入多行代码时不能使用<code>标签。

语法：
<code>代码语言</code>

注：如果是多行代码，可以使用<pre>标签。

<pre>标签-预格式化文本标签
语法：
<pre>语言代码段</pre>

<pre> 标签的主要作用:预格式化的文本。被包围在 pre 元素中的文本通常会保留空格和换行符。
注意：<pre> 标签完全按照你的排版来显示你所输入的文本，在你需要在网页中预显示格式时都可以使用它，其中一个常见应用就是用来展示计算机的源代码。

无序列表<ul>标签的应用-添加新闻信息列表
在浏览网页时，你会发现网页上有很多信息的列表，如新闻列表、图片列表等。
这些列表就可以使用ul-li标签来完成。ul-li是没有前后顺序的信息列表。
语法：
<ul>
<li>...</li>
<li>...</li>
...
</ul>

有序列表<ol>标签--添加图书销售排行榜
如果想在网页中展示有前后顺序的信息列表如，当当网上的书籍热卖排行榜时，又该用什么标签呢？这类信息展示就可以使用<ol>标签制作有序列表来展示。
语法：
<ol>
<li>信息</li>
<li>信息</li>
......
</ol>
举例：
下面是一个热点课程下载排行榜：
<ol>
<li>前端开发面试心法 </li>
<li>零基础学习html</li>
<li>JavaScript全攻略</li>
</ol>
<ol>在网页中显示的默认样式一般为：每项<li>前都自带一个序号，序号默认从1开始

最后是想告诉大家：这些全是由本站-http://www.imooc.com/learn/9 HTML+CSS基础课程总结而来的笔记，非原创！！