页面重构

重构是不改变代码外的行为前提下对代码做出修改，改进程序的内部结构。身为一个前端工作者我们在拿到需求的时候不应该立即编写代码，应以整体来考虑，包括代码的兼容性，语义，业务术语的命名，优化等。

一：
       1.浏览器内核？
          IE（ie内核）   火狐（Gecko）  谷歌（webkit）  欧朋（presto）
       2.hack写法？
          -0- 欧朋        -ms- 微软        -moz- 火狐      -webkit- 谷歌
          _    IE6         *      IE7        \0      IE8+      \9         ie6+... ...
       3.w3c标准及认识？
          标签闭合、正确嵌套、代码小写，外链样式和脚本，结构、表现和行为分离，容易维护、改版方便。
       4.xhtml、html区别？
          标签闭合、正确嵌套、代码小写
       5.前端分为哪三层？
          结构 html、样式 css、行为 js
       6.css样式（选择器）优先级？
          ①行间> 内嵌 >外链 >导入式
          ②行间 >ID >标签 >类（这个不确定）
       7.css层叠性（一块区域，有多个css文件设置它）？
           样式不冲突，优先级相同；样式有冲突，根据选择器优先级决定
       8.为什么要reset（重置）css？
          让各个浏览器统一样式显示
       9.页面三种渲染模式？
          怪异模式、标准模式和几乎标准模式
      10.标准/怪异模式区别？
          盒子模型渲染模式不同（当前模式 document.compatMode ；值是：9中的3选1）
     11.盒子模型？
          内容 + border+ padding+ margin
     12.块级元素/行内元素？
          块级元素：  div 、p 、h1~h6 、ul... ...
          行内元素：  a  、b 、i 、span 、input... ...
     13.什么是语义化标签？好处是什么？
          如：strong、header、footer 等标签，利于搜索引擎抓取（SEO）
     14.怎么网站优化，提高访问速度？
          ①文件合并，减少请求    ②压缩文件，减小体积
          ③缓存                      ④使用CDN托管

          yahoo35条优化   http://www.w3cfuns.com/blog-5434011-5397390.html
     15.css精灵的优缺点？
          优点：  减少图片请求
          缺点：  不易操作、维护
     16.怎么高效书写css？
          采用复合写法     如： font:字体大小/行高  粗细  样式  字体1，字体2；
     17.如何避免FOUC(flash of unstyled content文档样式短暂失效)?
          原因： ① import 导入样式   ② 样式表在页面底部 ③ 多个样式表冲突
          解决：样式表放在

中，用导入样式
     18.HTTP状态码？
          1xx临时响应  2xx成功  3xx重定向  4xx请求错误  5xx服务器端错误
     19.渐进增强/优雅降级？
          渐进增强：向上兼容，使用css3等新技术渲染界面
          优雅降级：向下兼容，对低版本浏览器的页面渲染处理，如禁止使用js的情况
     20.页面渲染原理？
          请求 --返回HTML文档 -- 发现css，（请求并）返回css -- 发现js，（请求并）返回js
          reflow：重新渲染
          repaint：重绘。比上面reflow程度轻，只改变部分样式，不会改变结构
     21.你使用SCSS/LESS等CSS预处理器吗？优点好处。
          代码更少，文件更轻
     22.开发工具你是用哪个？喜欢哪部分功能？
          Editplus              zen Coding功能
     23.为什么要配备多个DNS服务器？
          备用、分流
     24.你怎么制作和维护一个大型网站（涉及多人协作）？
          命名规范、编写习惯（如缩进都用tab键）、标注模块、标注编写人名字... ...

二：
      1.IE6浮动时，产生的双边距？
          _display:inline;
      2.IE6 3px的bug？
          *html 元素{margin-left/right：-3px；}
      3.IE6文本溢出？
          ①去除浮动  ②上下两个DIV间注释去掉 ③调整宽度
      4. IE6/7 display:inline-block 问题？
         ① _{display:inline-block;...}
               _{display:inline;}
         ② _{display:inline;zoom:1;...}
         ③ 元素之间的间隙解决：戳这里

      5.清除浮动的方法？
          多种清除浮动，HERE http://www.w3cfuns.com/blog-5422882-5396842.html
      6.IE6  fixed兼容？
          多种方法   http://www.w3cfuns.com/blog-5425270-5396408.html

三：
      1.多行文本溢出显示省略号？
         css3和jq两种方法，这儿   http://c7sky.com/text-overflow-ellipsis-on-multiline-text.html
      2.元素垂直居中？
         多种居中 http://www.w3cfuns.com/blog-5446019-5398780.html

         第二篇       http://www.w3cfuns.com/thread-5598861-1-1.html
         IE9 font垂直居中问题   http://www.w3cfuns.com/blog-1988-5397289.html
      3.css、js和ajax图片预加载？
         文章看这里   http://www.w3cfuns.com/thread-5598790-1-1.html

猜你喜欢