link和@improt的区别
- link输入html标签；@improt在css中使用表示导入外部样式表
- 页面被加载的时候，link会同时被加载，而@import引用的css会等到页面被加载完再加载
- imoprt只在IE5以上才能识别，而link是HTML标签，无兼容问题
- link支持使用javascript改变样式，后者不可。
渐进增强与优雅降级
- 渐进增强：一开始就针对低版本浏览器进行构建页面，完成基本的功能，然后再针对高版本浏览器进行效果、交互、追加功能达到更好的体验
- 渐进增强：一开始就构建站点的完整功能，然后针对浏览器测试和修复
- 渐进增强是相对于向上兼容；优雅降级是相对于向下兼容
什么是BFC?开启方式
BFC 即 Block Formatting Contexts (块级格式化上下文)，BFC是一个独立的布局环境，其中的元素布局是不受外界的影响，并且在一个BFC中，块盒与行盒（行盒由一行中所有的内联元素所组成）都会垂直的沿着其父元素的边框排列。
开启方式
- overflow的值不是visible
- float的值不是none
- position的值不是static或者relative(abslute或者fixed)
- display的值是inline-block、table-cell、fiex、table-caption或者inline-flex
盒子模型
src和href的区别
href表示超文本引用，用来建立当前元素和文档之间的链接。常用的有：link、a
src是引入，src指向的内容会嵌入到文档中当前标签所在的位置。常用的有：img、script、iframe
css精灵原理、优缺点
原理：CSS Sprites就是把网页中一些背景图片整合到一张图片文件中，再利用CSS的“background-imgage”,“background-repeat”,“background-position”的组合进行背景定位，background-position可以用数字精确地定位处背景图片的位置。
优点：
- 减少网页的http请求，提高页面性能
- 减少图片字节
- 解决图片命名的困扰
- 更换方便，一张修改，整个页面可改变
缺点：
- 图片合并需留足够空间，防止出现不必要背景，宽屏容易出现背景断裂
- 开发麻烦，需测量每个背景单元精确位置
- 维护麻烦，页面少许改动，其他图片和CSS也要改动
浮动的原理，以及浮动带来的影响及清楚浮动方法
浮动元素脱离文档流，不占据空间。浮动元素碰到包含它的边框或者浮动元素的边框停留。
浮动元素会造成父元素高度坍塌。
清楚浮动的方法
- 在浮动的元素后面添加一个空div:
<div class="clear"></div>,给该div添加样式clear{
clear:both;
} - 给父元素添加伪元素after
.clearfix::after{
display:block;
content:"";
clear:both;
} - clear:left清楚左浮动
clear:right清除右浮动
clear:both清除左右浮动