HTML和CSS基础面试题(四)问：less和sass的区别答： Less是基于JavaScript，是在客户端处理的

问：less和sass的区别

答：

Less是基于JavaScript，是在客户端处理的；Sass是基于Ruby的，是在服务器端处理的。
关于变量在Less和Sass中的唯一区别就是Less用@，Sass用$。
输出设置，Less没有输出设置，Sass提供4中输出选项：nested, compact, compressed 和 expanded。
Sass支持条件语句，可以使用if{}else{},for{}循环等等，而Less不支持。

问：xhtml和html有什么区别

答：
HTML与XHTML之间的差别，主要分为功能上的差别和书写习惯的差别两方面。
关于功能上的差别，主要是XHTML可兼容各大浏览器、手机以及PDA，并且浏览器也能快速正确地编译网页。
由于XHTML的语法较为严谨，所以如果你是习惯松散结构的HTML编写者，那需要注意XHTML的规则。

下面列出了几条容易犯的错误，供理解。

所有标签都必须小写

在XHTML中，所有的标签都必须小写，不能大小写穿插其中，也不能全部都是大写。
标签必须成双成对

像是<p>...</p>、<a>...</a>、<div>...</div>标签等，当出现一个标签时，必须要有对应的结束标签，缺一不可，就像在任何程序语言中的括号一样

标签顺序必须正确

标签由外到内，一层层包覆着，所以假设你先写div后写h1，结尾就要先写h1后写div。只要记住一个原则“先进后出”，先弹出的标签要后结尾。
所有属性都必须使用双引号

在XHTML 1.0中规定连单引号也不能使用，所以全程都得用双引号。
不允许使用target="_blank"

从XHTML 1.1开始全面禁止target属性，如果想要有开新窗口的功能，就必须改写为rel="external"，并搭配JavaScript实现此效果。

问：img标签上title与alt属性的区别是什么?

答：
alt：当图片不显示是用文字代表

title：为该属性提供信息

问：a标签中 active hover link visited 正确的设置顺序是什么?

答：
按照 lvha 顺序排列 a:link a:visited a:hover a:active

而引用CSS文件的@import就是造成这个问题的罪魁祸首。IE会先加载整个HTML文档的DOM，然后再去导入外部的CSS文件，因此，在页面DOM加载完成到CSS导入完成中间会有一段时间页面上的内容是没有样式的，这段时间的长短跟网速，电脑速度都有关系。解决方法：只要在<head>之间加入一个<link>或者<script>元素就可以了。

问：如何处理HTML5新标签的浏览器兼容性问题

答：
方法一 :

1、使用静态资源的html5shiv包

<!--[if lt IE9]>
<script src="http://cdn.static.runoob.com/libs/html5shiv/3.7/html5shiv.min.js"></script>
<![endif]-->

2、载入后，初始化新标签的css

header, section, footer, aside, nav, main, article, figure { display: block; }

方法二：

IE6/IE7/IE8支持通过document方法产生的标签，利用这一特性让这些浏览器支持HTML5新标签

问：HTML5的离线储存怎么使用，工作原理能不能解析一下？

答：
在用户没有与因特网连接时，可以正常访问站点或应用，在用户与因特网连接时，更新用户机器上的缓存文件。

原理：HTML5的离线存储是基于一个新建的.appcache文件的缓存机制(不是存储技术)，通过这个文件上的解析清单离线存储资源，这些资源就会像cookie一样被存储了下来。之后当网络在处于离线状态下时，浏览器会通过被离线存储的数据进行页面展示。

更新缓存：一旦应用被缓存，它就会保持缓存直到发生下列情况：

用户清空浏览器缓存
manifest 文件被修改
由程序来更新应用缓存

如何使用： 1、页面头部像下面一样加入一个manifest的属性； 2、在cache.manifest文件的编写离线存储的资源； 3、在离线状态时，操作window.applicationCache进行需求实现。

问：页面导入样式时，使用link和@import有什么区别

答：

1、link属于XHTML标签，除了加载CSS外，还能用于定义RSS（简易信息聚合，是一种基于XML标准，在互联网上被广泛采用的内容包装和投递协议），rel连接属性等作用；@import是CSS提供的，只能用于加载CSS；
2、页面被加载时，link会同时被加载；而@import引用的CSS会等到页面被加载完成后再加载；
3、link是XHTML标签，没有兼容问题；而@import只有在IE5以上才能被识别；
4、link支持使用JavaScript控制DOM修改样式；而@import不支持。

HTML和CSS基础面试题(四)