聚美优品前端开发面试题

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 属性）：
 

简答
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=" width:700px;">     <div style=" width:300px; margin-right:-300px;">     <img src="" alt="Image" style="width:300px;height:300px;border:0;" />     </div>     <div style=" width:300px; margin-left:300px;margin-top:-300px; background:red;">     <p>111</p>     </div>     </div>