前端大杂烩之二

1.rgba（）和opacity（）的透明效果有何不同
rgba（）和opacity都能实现透明效果，但最大的不同是opacity作用于元素，以及元素内的所有内容的透明度，
而rgba（）只作用于元素的的颜色或者背景颜色（设置rgba透明的元素的子元素不会继承透明效果）
2.css中可以让文字在垂直和水平方向上重叠的两个属性是什么
垂直方向：line-height
水平方向：letter-spacing
letter-spacing 可以消除line-block元素间得到换行符空格间隙问题
3. px和em的区别
px和em都是长度单位，区别是。px的值是固定的，em则不固定，并且em会继承父级元素的字体大小。
浏览器的默认字体高都是16px，所以未经调整的浏览器都符合：1em=16px
4.display：none与visibility：hidden的区别
display：隐藏对应的元素但不挤占该元素原来的空间
visibility：隐藏对应的元素并且挤占该元素原来的空间
即是，使用css display：none 属性后，元素的宽度高度等属性值会丢失，而使用visibility：hidden属性后，html元素仅仅是在视觉上看不见，而他所占据的空间位置仍然存在。
5.css中link和@import的区别是
link属于html标签，而@import是css中提供的
在页面加载的时候，link会同时加载，而@import引用的css会在页面加载完成后才会加载引用的css
@import 只有在ie5以上才可以被识别，而link是html标签，不存在浏览器兼容性问题
6.讲为什么要初始化样式
由于浏览器兼容性问题，不同的浏览器对标签的默认样式值不同，若不初始化会造成不同浏览器之间的显示差异
但是初始化css会对搜索引擎优化造成小影响
7.BFC是什么
BFC(会计格式化上下文)，一个创建了新的BFC的盒子是独立布局的，盒子内元素的布局不会影响盒子外面的元素，在同一个BFC中的两个相邻的盒子在垂直方向上发生margin重叠的问题 BFC是指浏览器中创建了一个独立的渲染区域，该区域所有元素的布局不会影响到区域外元素的布局，这个渲染区域只对块级元素起作用
8.html语义化是什么
当页面样式加载失败的时候能够让页面呈现出清晰的结构
有利于seo优化，利于被搜索引擎收录（便于搜索引擎的爬虫程序来识别）
便于项目的开发及维护，使HTML代码更具有可读性，便于其他设备解析
9.Doctype的作用，严格模式与混杂模式的区别
用于告知浏览器该以何种模式来渲染文档
严格模式下：页面排版及js解析是以该浏览器支持的最高标准来执行
混杂模式：不严格按照标准执行，主要用于兼容旧的浏览器，向后兼容
10.html与xhtml的区别
1.所有的标记都必须有一个相应的结束标记
2.所有标签的元素和属性的名字都必须使用小写
3.所有的XML标记都必须用引号“”括起来
4.xml标记必须合理嵌套
5.所有<和&特殊符号用编码表示
6.给所有属性赋值
7.不要在注释中使用”–“
8.图片必须有说明文字
11.html常见兼容性问题
1.双边距bug float引起的，使用display
12.对web标准以及w3c的理解和认识
答：标签闭合、标签小写、不乱嵌套、提高搜索机器人搜索几率、使用外链css和js脚本、结构行为表现的分离、文件下载与页面速度更快，内容能被更多的用户、设备访问，更少的代码和组件，易于维护、改版方便，不需要变动页面内容、提供打印版本而不需要复制内容，提高网站易用性
13.行内元素、块级元素、css的和盒模型、空（void）元素
块级元素：div p h1 h2 h3 h4 form ul ol li dl dd
行内元素：a b br i span input select strong
Css盒模型：内容，border，margin，padding
空（void）元素：

---

14.前端页面由那三层构成
结构层：html 表现层：css 行为层：js
15.css属性的继承
可继承：font-size font-family color ul li dl dd dt
不可继承：border padding margin width height
16.css优先级算法如何计算
！import >id>class>标签
！import 比 内联优先级高