重温html基础知识

   春节长假早已结束,假期间手机碎了,牙齿补了,亲戚走了,聚餐去了,红包领了,就是书没有看,所以趁着刚开学赶紧温习一下之前所学内容,弥补一下心中小小愧疚。
   今天复习的是最基础的html,那就从头开始吧。


     

1.html文档  

  
   首先是html的基本结构,即:
   <html>
     <head></head>
     <body></body>
   </html>
  
   那么包括<!doctype>吗?
   答案是否定的。那么首先我们要看<!doctype>是什么。<!doctype>其实是document type的简写,它的作用是对文档的声明,用来告诉浏览器文档使用哪种规范。如果不加上<!doctype>也是可以的,但是想要规范浏览器的行为,开启标准兼容模式就需要添加上<!doctype>了。
   这时候可以注意到所有的标签都是小写的,标签的大小写之间并没有什么区别,可以大写也可以小写,主要是样式看起来是否整齐规范的区别,所以建议全部用小写使得文本看起来干净整洁。
   在html中,我们也经常会对文档进行注释,这时注意我们所使用的注释方法是有所区别的,比如在css和javascript中,我们经常使用//来添加注释,在html中我们则使用<!--标签内容-->进行注释,它们是不同的。当然大家一般都是用快捷键,比如mac中的command+/,windows中的win+/,就不再多说了。


  

2.html中的标签

根标签

  我们学习html的时候会接触到很多标签,在html文档中有根标签<head></head>包含属性title script link style meta base以及<body></body>

标题标签   

  标题标签也就是h标签,从h1到h6一共有6个,分别对应一级到六级的标题,重要程度从高到低递减,也就是权重依次降低,它们的字体大小也会随之变小,本质是为了呈现内容结构,同时也是方便搜索引擎更好的抓取和分析出页面的主题内容,如果随意添加则不方便用户搜索到想要的相关内容。
  一般在一个网页中h1标签只存在一个,它是主标题,所以不能同时在页面中存在多个,也不能随便使用,一般在标题或者对页面中的关键词进行添加;h2标签表示一个段落的标题,或者说副标题,部署长尾关键词;h3标签则表示段落的小节标题,h3标签效果跟strong差不多,一般是用在段落小节;h4-h6标签基本很少用到,是告诉搜索引擎这些不是很重要的内容,当一篇文章内容较多的时候,可以用来说明一些内容是不很重要的。h2-h6可以进行多次使用。但是对于seo来说,无限制的多次使用h标签会逐渐稀释标签的权重,不方便搜索引擎的爬虫进行信息整理,所以不要小看标题标签,如何行之有效的合理规划标题标签的使用也是一个页面是否规范的表现之一。

段落标签

  段落标签p,它是一个块级标签,常常我们在需要分段大换行时候,对内容前加<p>内容后加</p>即可实现文章换段落。

em标签  

  em是emphasis的简写,意思是强调;着重;鲜明;突出;重读。在html中是将内容变为斜体,它和另外一个标签非常类似,那就是<i>标签。i标签同样是使字体斜体化,在视觉表现上em标签和i标签是完全相同的。但是请注意我说的只是两者在视觉上的表现,也就是说它们作用于字体的外观是相同的,不同点则在于<em>标签拥有语义化的作用,在开头就说明了它自身的含义,标签也具有相同的效果。  

strong标签  

  strong标签的含义和em标签有一些类似,都是表达强调的作用,在表现上是对字体进行加粗,同样有另外一个标签与其表现相同,就是<b>标签,b标签是bold的简写,也是对字体进行加粗,但是仅仅只是加粗,和strong比起来也没有语义化。  

em与strong的区别  

  首先是表现形式,<em>为斜体,<strong>为粗体。  
  其次是语义化,从上面可以看到<em><strong>都是表强调,两者之间还是有些区别的。<em>表示一般的强调文本,<strong>表更加强调,他们的强调等级不同,<strong>的强调级别要更加高一些。  

div标签  

  div是用来定义文档中的分区或节,它是html中最基本的标签之一  

span标签  

   

a标签  

  <a>标签是用来定义超链接,用于从一张页面链接到另一张页面。它常用的属性中最重要的是href属性,用来指示链接的目标。同时有用一个title属性,描述该链接;此外还有target,a标签的 target属性规定在何处打开链接文档。如果在一个a标签内包含一个 target 属性,浏览器将会载入和显示用这个标签的 href 属性命名的、名称与这个目标吻合的框架或者窗口中的文档。如果这个指定名称或 id 的框架或者窗口不存在,浏览器将打开一个新的窗口,给这个窗口一个指定的标记,然后将新的文档载入那个窗口。从此以后,超链接文档就可以指向这个新的窗口。常用的打开方式有两种,一种是当前页面打开被链接文档,用_self,另一种在新窗口打开被链接文档,用_blank。  

img标签  

  img标签用来向网页中嵌入一幅图像。从技术上讲,<img> 标签并不会在网页中插入图像,而是从网页上链接图像。<img>标签创建的是被引用图像的占位空间。所以它拥有两个基本属性,1.alt用来在图片无法正常显示的时候对该图片内容进行描述;2.src用来填写图片的url路径。