HTML之认识标签(一)

2-1. 语义化, 让你的网页更好的被搜索引擎理解

标签的用途:  我们学习网页制作时, 常常会听到一个词,语义化。那么什么叫做语义化呢，说的通俗点就是: 明白每个标签的用途(在什么情况下使用此标签合理) 比如, 网页上的文字的标题就可以用标题标签，网页上的各个栏目名称也可以使用标签标题。文章中内容的段落就得放在段落标签中, 在文章中有想强调的文本，就可以使用 em标签标示强调等等。

优点:1.更容易被搜索引擎收录。2.更容易让屏幕阅读器读出网页内容。

2-2. 标签，网页上显示的内容放在这里

在网页上要展示出来的内容一定要放在body标签中。

2-3.

标签,添加段落

2-4. 标签, 为网页添加标题 

2-5. 加入强调语气, 使用和标签

2-6. 标签

标签是没有语义的，它的作用就是为了设置单独的样式用的

2-7. 标签, 短文本引用 

作用: 在html中加一段引用，不如引用某个作家的一句诗，使文章更加出彩。

引用文本    

周瑜，不可否认，他是历史上一个了不起的英雄人物！确实也配的上那句聪明秀出为之英，胆略过人为之雄。

2-8.

标签,长文本引用

的作用也是引用别人的文本。但是它对长文本的引用, 如在文章中引入大段某知名作家的文字, 这是需要这个标签。

标签是对短文本的引用, 如引用一句话就用到标签

心似桂花开
大家都在忙于自认为最重要的事情，却没能享受到人生的乐趣，反而要吞下苦果？
暗淡轻黄体性柔，情疏迹远只香留。何须浅碧深红色，自是花中第一流。
这是李清照《咏桂》中的词句，在李清照看来，桂花暗淡青黄，性情温柔，淡泊自适，远比那些大红大紫争奇斗艳花值得称道。

2-9. 使用
标签分行显示文本

对于2-8的例子，我们想让那首诗显示得更美观些，如显示下面的效果  

怎么可以让每一句诗词后面加入一个折行呢？那就可以用到
标签了，在需要加回车的换行的地方加入
,
标签的作用相当于word文档中的回车。

《咏桂》
暗淡轻黄体性柔，
情疏迹远只香留。
何须浅碧深红色，
自是花中第一流。

2-10.  为你的网页中添加一些空格

感悟梦想
来源：作文网  作者：为梦想而飞

2-11. 认识

---

标签, 添加水平横线

火车飞驰过暗夜里的村庄，月光，总是太容易让思念寂寞，太容易让人觉得孤独。

每一枚被风吹起的蒲公英，都载满了一双眼睛的深情告别与一个目光的依依不舍。那天，我拿着行李，带上一个背影的祝福与惆怅，挥手告别了这片土地。我不知道，我何时会回来。

2-12. 

标签, 为网页加入地址信息

一般网页中会有一些网站的联系地址信息需要在网页中展示出来,这些联系地址信息如公司的地址就可以

标签。也可以定义一个地址（比如电子邮件地址）,签名或者文档的作者的身份。

语法:

        

联系地址信息

 

如：

       

文档编写：lilian 北京市西城区德外大街10号

慕课网
超酷的互联网、IT技术免费学习平台，创新的网络一站式学习、实践体验；服务及时贴心，内容专业、有趣易学。专注服务互联网工程师快速成为技术高手!公司地址：
北京市西城区德外大街10号
 

2-13. 加入一行代码? 使用  标签

在介绍语言技术的网站中, 避免不了在网页中显示一些计算机专业的编程代码，当代码为一行代码时，你就可以使用标签

var i = i + 300  

注意:在文章中一般如果要插入多行代码时不能使用标签了

注：如果是多行代码, 可以使用

标签
 
  
									
							





    
我们可能知道水平渐变的实现，类似这样：
        {background-image:linear-gradient(left, red 100px, yellow 200px);}

 
  
 
  
 
  
 
  
2-14.  使用  
 标签为你的网页加入大段代码
 
  
 
  
语法：
 
  
语言代码
 
  
标签的主要作用: 预防格式化的文本。被包围 pre 元素中的文本通常会保留空格和换行符。
 
  







    var message="欢迎";
    for(var i=1;i<=10;i++)
    {
        alert(message); 
    }