觸寶前端面試題

時間 2019-12-05

標籤端面試題简体版

原文原文鏈接

參加完觸寶的前端筆試，總結一下筆試的題

1.一個頁面上存儲了10^n個按鈕，請實現功能：點擊按鈕時，顯示這是頁面上的第幾個按鈕（alert便可）css

代碼以下：html

window.onload=function(){
  var l=document.buttons.length;
  for(var i=0;i<l;i++){
    document.buttons[i].onclick=function(x){
      alert(x+1);
    }(i);
  }
}

2.用html+css實現以下框架：上方爲四幅圖片，實現其無縫鏈接，左邊爲導航欄，寬度固定爲100px，右邊長度可拉伸//圖片沒有，請自行腦補。。前端

主要代碼以下：web

html:框架

<body>
  <div class="top">
    <div class="photo"><img src="url"></div>
    <div class="photo"><img src="url"></div>
    <div class="photo"><img src="url"></div>
    <div class="photo"><img src="url"></div>
  </div>
  <div class="container">
  <div class="left">sidebar</div>
  <div class="right">content</div>
  </div>
</body>

css:ide

*{
    margin: 0;
    padding: 0;
}

.top{
  width:100%;
  height:50px;
  display:-moz-box;
  display:-webkit-box;
  display:box;
  padding:0;
  margin:0;

}
 
.top .photo{
    -moz-box-flex:1;
    -webkit-box-flex:1;
    box-flex:1;
}

.container{
  margin:0;
  padding:0;
}

.container::after,
.container::before{/*清除浮動*/
  content:"";
  display:table;
}

.container .left{
  width:100px;
  float:left;
}

.container .right{
  margin-left:100px;
}

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。