聚美优品前端开发面试题

CSS
1.  overflow-x  属于 CSS2 还是 CSS3
2.  请列举几种可以清除浮动的方法（至少两种）
3.  display:none  和  visibility:hidden  的区别是什么
4.  请缩写以下代码：
.box {
   background-position: 10px 20px;
   background-repeat: no-repeat;
   background-attachment: fixed;
   background-color: red;
   background-image: url(box.png);
}
5.  如何让一段文本中的所有英文单词的首字母大写

Javascript
1.  请解释一下什么是闭包
2.  call 和 apply 的区别是什么
3.  如何使用原生 Javascript 代码深度克隆一个对象（注意区分对象类型）
4.  jQuery 中  $('.class')  和  $('div.class')  在 IE 8 下哪个效率更高，请解释原因

HTML
1.  以下哪个不是 HTML5 的新标签：
a.  <article>
b.  <section>
c.  <address>
d.  <time>
2.  正确使用 HTML 和 CSS 实现以下效果（中间方框部分表示图片，右侧为文字列表。尽量不要
使用 float 属性）：
未命名.gif

简答
1.  jumei.com 和 weibo.com 完整载入后，html 代码各有多少 KB
2.  最近关注了哪些前端相关的技术/博客/论坛，简述心得和看法

下面为某网友的答案

1.  overflow-x  属于 CSS2 还是 CSS3
解答:属于CSS2 (查手册的,不知道对不对)

2.  请列举几种可以清除浮动的方法（至少两种）
解答:
(1) 使用div空标签清除浮动(不是div需要display:block): .clear{clear:both;}
个人比较喜欢这种，兼容与所有浏览器
(2) 使用after伪类:（YUI）
.clearfix:after{content:”.”;height:0;display:block;visibility:hidden;clear:both}
.clearfix{-height:1%;*min-height:1%}
(3) 网上看到的一种：
.clear{ float:none;overflow:hidden;_zoom: 1;}

3.  display:none  和  visibility:hidden  的区别是什么
解答：display:none 表示元素不可见，不会占有内存；visibility:hidden表示元素不可以，但是还占有页面空间，占有内存，通常不建议使用。

4.  请缩写以下代码：
.box {
   background-position: 10px 20px;
   background-repeat: no-repeat;
   background-attachment: fixed;
   background-color: red;
   background-image: url(box.png);
}
解答：.box{background:red url(box.png) no-repeat fixed 10px 20px}

5.  如何让一段文本中的所有英文单词的首字母大写
解答：.content p{text-transform:capitalize;}

让一段文本中的所有英文单词的(首字母|所有)大写/小写

text-transform:capitalize; 首字母大写

text-transform:uppercase;所有单词大写

text-transform:lowercase;所有单词小写

Javascript
1.  请解释一下什么是闭包
解答：个人理解为常驻内存的对象

2.  call 和 apply 的区别是什么
解答：对call,apply 我了解不多，给个地址大家看吧，这里面讲的比较好。
http://www.cnblogs.com/fighting_ ... /09/20/1831844.html

3.  如何使用原生 Javascript 代码深度克隆一个对象（注意区分对象类型）
解答：这个我也只知道有一个concat 方法(其他的方法就很少用)，百度查了一下给大家一个地址吧，http://www.cnblogs.com/svage/archive/2011/06/11/2078049.html

4.  jQuery 中  $('.class')  和  $('div.class')  在 IE 8 下哪个效率更高，请解释原因
解答：$('div.class') 的效率更高，因为$('div')的原型的 getElementsByTagName 所以效率更高

HTML
1.  以下哪个不是 HTML5 的新标签：
a.  <article>
b.  <section>
c.  <address>
d.  <time>
解答：d.  <time>

2.  正确使用 HTML 和 CSS 实现以下效果（中间方框部分表示图片，右侧为文字列表。尽量不要
使用 float 属性）：

解答：这个有点难度，他考察的是什么。我就知道知道4种。
1. table 表格，我看这个是不可以的，直接Pass
2. 图片使用背景，文字padding,估计也是不合题意，Pass
3. 使用相对定位，这个就不说大家都会。
4. 使用margin 负值
<div style=" 700px;">
<div style=" 300px; margin-right:-300px;">
<img src="" alt="Image" style="300px;height:300px;border:0;" />
</div>
<div style=" 300px; margin-left:300px;margin-top:-300px; background:red;">
<p>111</p>
</div>
</div>