html5

1、Html5语义化标签的理解

1)用正确的标签做正确的事情;

2)html语义化让页面的内容结构化,结构更清晰,便于对浏览器、搜索引擎解析;

3)即使在没有样式css情况下也以一种文档格式显示,并且是容易阅读的;

4)搜索引擎的爬虫也依赖于HTML标记来确定上下文和各个关键字的权重,利于SEO;

5)使源代码便于阅读理解理解维护。

 

2、都有哪些标签,什么意思,各有什么特性。

1)块级标签:标签独占一行,可指定宽、高。 

  特性:

  1. 能够识别宽高

  2. marginpadding的上下左右均对其有效

  3. 可以自动换行

  4. 多个块状元素标签写在一起,默认排列方式为从上至下

  5. 可以使用margin:0 auto居中对齐

常用的块级标签:<div>、<p>、<h1>...<h6>、<ol>、<ul>、<dl>、<table>、<address>、<blockquote>、<form>

2)行内标签:标签在一行内,宽度与高度由内容决定,只有在内容超过HTML的宽度时,才会换行。

  特性:

  1. 无法设置宽高

  2. margin上下无效,只有左右有效果,padding都有效果,会撑大空间;box-sizing:border-box;无效,因为该属性针对盒模型。

  3. 不会自动换行

常用的行内标签:<a>、<span>、<i>、<em>、<strong>、<label>、<q>、<var>、<cite>、<code>

3)行内块标签:同时具备内联元素、块状元素的特点,代码display:inline-block就是将元素设置为内联块状元素。(css2.1新增),<img>、<input>标签就是这种内联块状标签。

   特性:

  1. 不会自动换行

  2. 能够设置宽高

  3. 默认排列方式为从左到右

  4. 可以使用text-align:center使内容相对于父盒子水平居中对齐,例如img标签,可以使用text-align:center,相对父盒子居中对齐、margin:0 auto无效

  5. 水平排列,但所有元素默认会有1个空格的间隙,因为元素之间在html中书写有回车换行,浏览器解析会将其解析成一个空格。

 

3、三类标签如何转换

  • display:inline;转换为行内元素

  • display:linline-block;转换为行内块元素

  • display:block;转换为块级元素

4、display有哪些值

 

 

 

 

 

 

 

 

 

 

  

posted @ 2021-11-26 00:02  浅倾  阅读(51)  评论(0)    收藏  举报