早上投了淘宝网的简历，中午就收到邮件通知了，下午就打电话进行电话面试，很有效率。

   大致总结一下，电话面试，先是问一下目前的生活状况，然后到主要的技术面试，能答上很多问题，也有很多问题回答不上来，我是属于让我写一个网站会写，原理什么我不懂的人，还有原生态的js也一窍不通。我面试的是csser，对于淘宝而言，他们要的是前端开发，而我现在还很薄弱，脚本这块一直是我的软肋，但css这块我又不是很精通，就是会写效果，在小公司里，别人不管你怎么实现，不管你的代码写的怎么样，只看最后效果。

   不管这次有没有通过，对自己也有个小警示，原来自己的水平也就一般般，之前在msn上携程网的面试，我更是不战而败，当时发来一份面试题，我还不习惯特意去做题，无从下手，最后就不了了之。。

   觉得有时候机会错失也蛮可惜的，只是自己的技术一直没提高，哎，，得好好加油了，不要每天喊喊口号。对于css的技术要去了解，而不是只会做，不知道为什么要这样做。。

   关于面试问题，遇到几个问题：

1，ie有几种渲染方式，后来我才知道是bug。只记得双倍边距等几个ie6的问题，解决办法就是用hack解决；

 上网查了一下，还有几种渲染方式，如下：

   
   
   
   
    
    
    
    
    
  1. 1. size,padding和margin距离异常 
    2. 
    
    
    
    
  2.  
    3. 
    
    
    
    
  3. 在IE6中,各种size,padding和margin总是感觉怪怪的,有时候死活差那么几个像素.这时候可以使用单独为IE准备的CSS文件来纠正.只需要在页面头部加类似这样的CSS文件即可: 
    4. 
    
    
    
    
  4. 2.    <link rel="stylesheet" href="css/ie6.css" type="text/css" media="screen" /> 
    5. 
    
    
    
    
  5. 3.> 
    6. 
    
    
    
    
  6.  
    7. 
    
    
    
    
  7. 其中的ie.css是对主CSS文件中,那些在IE6下显示异常的元素,重新定义的CSS. 
    8. 
    
    
    
    
  8. 2. 块元素居中问题 
    9. 
    
    
    
    
  9.  
    10. 
    
    
    
    
  10. 在现代浏览器中,一个块元素,假设是一个p,设置了宽度,设置左右margin都是auto之后,渲染效果应该是居中.但是在IE中,必须对其父元素,假设是body,加text-align:center;才能看到居中效果: 
    11. 
    
    
    
    
  11. 1.body { text-align: center; } 
    12. 
    
    
    
    
  12.  
    13. 
    
    
    
    
  13. 并且,你还要在子元素p里把继承的居中纠正回来: 
    14. 
    
    
    
    
  14. 1.p { text-align: left; } 
    15. 
    
    
    
    
  15. 3. div最小高度不能低于12px的bug 
    16. 
    
    
    
    
  16.  
    17. 
    
    
    
    
  17. 如果你需要一个高度很小的div,假设说做一个分隔线之类,你会发现div最小高度不会低于12px.这时候要设置div的line-height: 0;才行. 
    18. 
    
    
    
    
  18. 1.<div style="line-height: 0px; height: 2px;">div> 
    19. 
    
    
    
    
  19.  
    20. 
    
    
    
    
  20. 如果还是不行,你要在div里套一个p,并且指定这个p的line-height: 0;. 
    21. 
    
    
    
    
  21. 1.<div style="height: 2px;"><p style="line-height: 0px;">p>div> 
    22. 
    
    
    
    
  22. 4. 浮动元素的双倍margin距离bug 
    23. 
    
    
    
    
  23.  
    24. 
    
    
    
    
  24. 这是一个非常严重的bug.你会发现你的侧边栏总会跑到第二行去显示,或者明明你计算好宽度,平分两半,还预留了些空隙,在Firefox显示正常,在屏幕左右分布的两个块元素,在IE下非换行不可.说起来应当是IE的float块元素,margin加倍渲染的bug. 
    25. 
    
    
    
    
  25. 这样的代码: 
    26. 
    
    
    
    
  26. 1..floatbox { 
    27. 
    
    
    
    
  27. 2.   float: left; 
    28. 
    
    
    
    
  28. 3.   width: 150px; 
    29. 
    
    
    
    
  29. 4.   height: 150px; 
    30. 
    
    
    
    
  30. 5.   margin: 5px 0 5px 100px; 
    31. 
    
    
    
    
  31. 6.   /*This last value applies the 100px left margin */ 
    32. 
    
    
    
    
  32. 7.} 
    33. 
    
    
    
    
  33.  
    34. 
    
    
    
    
  34. 正确的渲染应该是这样: 
    35. 
    
    
    
    
  35.  
    36. 
    
    
    
    
  36. marg-norm 
    37. 
    
    
    
    
  37.  
    38. 
    
    
    
    
  38. 但是在IE5和IE6里,margin的100px被加倍,渲染成这个样子: 
    39. 
    
    
    
    
  39.  
    40. 
    
    
    
    
  40. marg-doubled 
    41. 
    
    
    
    
  41.  
    42. 
    
    
    
    
  42. margin被加倍成了200px. 
    43. 
    
    
    
    
  43. 浮动元素的双倍margin距离bug的出现条件和特点是: 
    44. 
    
    
    
    
  44.  
    45. 
    
    
    
    
  45.     float块元素 
    46. 
    
    
    
    
  46.     margin方向与float方向相同,即float: left;的块只会加倍margin-left的值. 
    47. 
    
    
    
    
  47.     这个float块与其父容器的内边之间夹着这个margin的情况下,才会加倍.当前行的第二个float块,因为其左边不是父容器的内边,就不会出现这个bug. 
    48. 
    
    
    
    
  48.     浮动元素的双倍margin距离bug具备左右对称性. 
    49. 
    
    
    
    
  49.  
    50. 
    
    
    
    
  50. 修复很简单,在所有float的元素的CSS中加入display: inline;即可.其实根据W3C对float的定义,当float具备left或者right时,display效果应当是不起作用的,除非是display: none;,但是指定了display: inline;确实让IE6正确显示了margin. 
    51. 
    
    
    
    
  51. 5. 盒模型的bug 
    52. 
    
    
    
    
  52.  
    53. 
    
    
    
    
  53. 看这样一段代码: 
    54. 
    
    
    
    
  54. 1.div#box { 
    55. 
    
    
    
    
  55. 2.   width: 100px; 
    56. 
    
    
    
    
  56. 3.   border: 2px solid black; 
    57. 
    
    
    
    
  57. 4.   padding: 10px; 
    58. 
    
    
    
    
  58. 5.} 
    59. 
    
    
    
    
  59.  
    60. 
    
    
    
    
  60. 根据盒模型定义,这个div的宽度应该是2+10+100+10+2=124px.大部分浏览器也是这样解析的,唯独IE6认为它是100px宽. 
    61. 
    
    
    
    
  61. 这个bug会对布局带来严重影响.消除这个bug只需要在页首制定DTD即可. 
    62. 
    
    
    
    
  62. 1.> 
    63. 
    
    
    
    
  63.  
    64. 
    
    
    
    
  64. 此前的一篇文章这样解释:在页首制定了DTD,浏览器就认定Web开发者知道并理解DTD,于是就会使用兼
    65. 
    
    
    
    
  65. 容标准的方式来解析和渲染页面. 
    66.

 2，一个body中，有左右两列，除了float之外，还能用什么方法布局？

   我就想到定位

3，选择器的优先权

   id选择器最优先

4，如何把重要的代码放带页面头部，不影响页面布局？这个我还真不知道哦，他看我看一下taobao的首页，我好像没发现什么特别呀？？求解

5，有一个div中有很多p元素，设置p元素为浮动，这个div的高度？

   一时没想出来，原来是没有高度，这个很简单的问题。居然当时没想到，如果解决它的无高度问题，加一下clearfix，这个我从来都是网上找的，他一问我内容，我就依稀记得，好像有height=1%和clear：both。。

6，还有几个问题，现在想不起来啦。。

携程网的面试题之一：

有兴趣的同学可以试试噢。。