zoukankan      html  css  js  c++  java
  • 聚美优品前端开发面试题

    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>

  • 相关阅读:
    vue销毁当前组件的事件监听
    手机端下拉加载
    解决html2canvas在苹果手机上不调用问题
    html2canvas使用
    vue中三种路由传参方式
    倒计时
    判断打开的是企业微信浏览器和微信浏览器的方法
    js计算精度不准问题
    el-input 无法触发@keyup.enter 解决方法
    浏览器渲染页面的流程(参考网上有关资料整理)
  • 原文地址:https://www.cnblogs.com/mabelstyle/p/3715924.html
Copyright © 2011-2022 走看看