• 面试题目(2)


         面试第二天,貌似已经习惯了记下笔试题目,然后去温习自己不懂的地方。就当面试,是一个不断温习的过程,不断进步的过程。

         1、div2放在div1中,需要通过CSS将div2放置于div1的右下角

       <div id="div1">

        <div id="div2"></div> 

       </div>

        当时想到的是用margin去控制,但是想到没有宽度和高度,故而想到了定位,这个题目很狡猾,它从字面上没提到定位二字。所以,我在div2中写的是position:relative;bottom:0;right:0;没细想,事实上这句话是有问题的,因为我写的relative,div1是父元素,并没有定位,所以就算是相对定位,也依旧是左上角。正确的应该是这样:

          

    <style>
        #div1{border:1px solid #ccc; 500px; height:200px; position:relative;}
        #div2{border:1px solid #663399; 198px; height:100px; position:absolute;bottom:0; right:0;}
    </style>
    
    
    <div id="div1">
            <div id="div2"></div>
    </div>

         

          2、ie中超过300px的文字就显示省略号 

       看到这个题目时,傻眼了,因为我脑子里深知有个css的属性来控制它的,但是总也想不起来。好吧,只能写了短点儿的js。好吧,现在还是好好回忆下真正的答案。

    <style>
    span{
        200px;
        display:block;
        overflow:hidden;
        white-space:nowrap;
        text-overflow:ellipsis;
    }
    </style>    
    
    
    <div>
        <span>CSS实现文字超出宽度显示省略号</span>
    </div>

            

       3、用js或者jq写出选项卡的实现(无需写css)

        <div  class="a"  id="a">

          <ul class="b"  id="b">

            <li  class="cur">切换一</li>

            <li>切换二</li>

            <li>切换三</li>

          </ul>

          <ul>

            <li class="active">内容一</li>

            <li>内容二</li>

            <li>内容三</li>

          </ul>

        </div>

       

            4、三种浏览器兼容性bug及其解决方案?

        

       5、三种清除浮动的方法

  • 相关阅读:
    android 获取字体宽高
    android 渐变
    android 拖动按钮
    android 模拟器使用
    android 启动其它apk
    How to solve Error: This attribute must be localized. 两种方式
    Chirp用音频 传输文件
    android 打开指定网页
    防止apk被反编译
    iphone 滑块制作
  • 原文地址:https://www.cnblogs.com/wanliyuan/p/3624403.html
Copyright © 2020-2023  润新知