html css 高频题（2）

1.display：none与visibility：hidden的区别是什么？

display：隐藏对应的元素但不挤占该元素原来的空间

visibility：隐藏对应的元素但是挤占该元素原来的空间

使用CSS display：none属性后，HTML元素（对象）的宽度、高度等各种属性值都将“丢失”,而使用visibility：hidden属性后，HTML元素（对象）仅仅是在视觉上看不见（完全透明），而它所占的空间仍然存在。

2.CSS中link与@import的区别是：

link属于html标签，而@import是CSS提供的

在页面加载的时候，link会同时被加载，而@import引用的CSS会在页面加载完成后才会加载引用CSS

@import只用在ie5以上才可以使用，而link是html标签，不存在浏览器兼容性问题，link引入样式的权限大于@import的引用（@import是将引用的样式导入到当前的页面中）

3.HTML与XHTML的区别

1.html是一种文本网页设计语言，xhtml是基于xml置标语言。

2.xhtml必须正确的嵌套

3.xhtml必须正确的关闭

4.xhtml标签名必须是小写字母

5.xhtml必须有根目录

4.CSS的盒子模型？

有两种：IE盒子模型，标准W3C盒子模型

IE盒子模型（怪异盒模型）：包括了border和padding box-sizing:content-box；

width =【border + padding + 内容（content）的宽度】+margin

height =【 border + padding + 内容（content）的高度】+margin

标准W3C盒子模型：只有内容 box-sizing:border-box；

标签实际宽度 = 设【】置的width宽度】+ border宽度 + padding的宽度+margin

5.CSS优先级算法如何计算？

！important>id>class>标签

！important比内联优先级高

*优先级就近原则，样式定义最近者为准

*以最后载入的样式为准

6.display属性有哪些？可以做什么？

display:block 行内元素转块级元素

display:inline 块级元素转换为行内元素

display:inline-block 转换为行内块元素

7.什么是外边距重叠？重叠的结果是什么？

外边距重叠就是margin-collapse

在CSS当中，相邻的两个盒子（可能是兄弟关系也可能是祖先关系）的外边距可以结合程一个单独的外边距，这种合并外边距的方式被称为折叠，并且称之为折叠外边距

折叠结果遵循以下计算规则：

8.CSS中可以通过哪些属性定义，使得一个DOM元素不显示在浏览器可视范围内？

最基本的：

设置display 属性为none，或者设置visibility：hidden

技巧性：

设置宽度为0,透明度为0，设置z-index位置在-1000

9.为什么要初始化样式？

由于浏览器兼容性的问题，不同的浏览器对标签的默认样式值不同，若不初始化会造成不同浏览器之间的显示差异

但是初始化CSS会对搜索引擎造成较小影响

10.html语义化是什么？

当页面样式加载失败的时候能够让页面呈现出清晰的结构

有利于seo优化，利于被搜索引擎收录（更便于搜索引擎的爬虫由程序来识别）