您的位置:首页 > 职场人生

淘宝面试电话

2011-09-22 21:22 375 查看
早上投了淘宝网的简历,中午就收到邮件通知了,下午就打电话进行电话面试,很有效率。

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

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

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

关于面试问题,遇到几个问题:

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

上网查了一下,还有几种渲染方式,如下:

1. size,padding和margin距离异常

在IE6中,各种size,padding和margin总是感觉怪怪的,有时候死活差那么几个像素.这时候可以使用单独为IE准备的CSS文件来纠正.只需要在页面头部加类似这样的CSS文件即可:
2.    <link rel="stylesheet" href="css/ie6.css" type="text/css" media="screen" />
3.<![EndIf]-->

其中的ie.css是对主CSS文件中,那些在IE6下显示异常的元素,重新定义的CSS.
2. 块元素居中问题

在现代浏览器中,一个块元素,假设是一个p,设置了宽度,设置左右margin都是auto之后,渲染效果应该是居中.但是在IE中,必须对其父元素,假设是body,加text-align:center;才能看到居中效果:
1.body { text-align: center; }

并且,你还要在子元素p里把继承的居中纠正回来:
1.p { text-align: left; }
3. div最小高度不能低于12px的bug

如果你需要一个高度很小的div,假设说做一个分隔线之类,你会发现div最小高度不会低于12px.这时候要设置div的line-height: 0;才行.
1.<div style="line-height: 0px; height: 2px;"></div>

如果还是不行,你要在div里套一个p,并且指定这个p的line-height: 0;.
1.<div style="height: 2px;"><p style="line-height: 0px;"></p></div>
4. 浮动元素的双倍margin距离bug

这是一个非常严重的bug.你会发现你的侧边栏总会跑到第二行去显示,或者明明你计算好宽度,平分两半,还预留了些空隙,在Firefox显示正常,在屏幕左右分布的两个块元素,在IE下非换行不可.说起来应当是IE的float块元素,margin加倍渲染的bug.
这样的代码:
1..floatbox {
2.   float: left;
3.   width: 150px;
4.   height: 150px;
5.   margin: 5px 0 5px 100px;
6.   /*This last value applies the 100px left margin */
7.}

正确的渲染应该是这样:

marg-norm

但是在IE5和IE6里,margin的100px被加倍,渲染成这个样子:

marg-doubled

margin被加倍成了200px.
浮动元素的双倍margin距离bug的出现条件和特点是:

float块元素
margin方向与float方向相同,即float: left;的块只会加倍margin-left的值.
这个float块与其父容器的内边之间夹着这个margin的情况下,才会加倍.当前行的第二个float块,因为其左边不是父容器的内边,就不会出现这个bug.
浮动元素的双倍margin距离bug具备左右对称性.

修复很简单,在所有float的元素的CSS中加入display: inline;即可.其实根据W3C对float的定义,当float具备left或者right时,display效果应当是不起作用的,除非是display: none;,但是指定了display: inline;确实让IE6正确显示了margin.
5. 盒模型的bug

看这样一段代码:
1.div#box {
2.   width: 100px;
3.   border: 2px solid black;
4.   padding: 10px;
5.}

根据盒模型定义,这个div的宽度应该是2+10+100+10+2=124px.大部分浏览器也是这样解析的,唯独IE6认为它是100px宽.
这个bug会对布局带来严重影响.消除这个bug只需要在页首制定DTD即可.
1.<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

此前的一篇文章这样解释:在页首制定了DTD,浏览器就认定Web开发者知道并理解DTD,于是就会使用兼
容标准的方式来解析和渲染页面.

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

我就想到定位

3,选择器的优先权

id选择器最优先

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

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

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

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

携程网的面试题之一:



有兴趣的同学可以试试噢。。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息