网页重构面试题（整理）

来源：互联网发布：python scapy 抓包编辑：程序博客网时间：2024/05/22 09:49

       一：基础知识
      二：常见bug
      三：实例处理技法

一：
   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条优化
   15.css精灵的优缺点？
      优点：  减少图片请求
      缺点：  不易操作、维护
   16.怎么高效书写css？
      采用复合写法    如： font:字体大小/行高  粗细  样式  字体1，字体2；
   17.如何避免FOUC(flash of unstyled content文档样式短暂失效)?
      原因： ① import 导入样式 ② 样式表在页面底部 ③ 多个样式表冲突
      解决：样式表放在<head>中，用<link>导入样式
   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
   6.IE6  fixed兼容？
        多种方法

三：
   1.多行文本溢出显示省略号？
      css3和jq两种方法，这儿
   2.元素垂直居中？
      多种居中   第二篇
      IE9 font垂直居中问题
   3.css、js和ajax图片预加载？
      文章看这里

0 0