一道引人深思的前端面試題

2022-07-05 17:54:18 字數 1272 閱讀 3415

這絕對是一道值得深思的題目,幫你明白布局的死角。

side

footer

1、完成經典的上 header ,下 footer ,左邊是側邊欄,右邊是內容。

2、去掉列表前面的 · ,列表項水平排列,注意裡面的br標籤需要換行,同時每兩個li後有一條豎線。

3、點選列表項不跳轉,彈出href內的內容。

/* css here */

#side

#main

思考:(這裡是精髓)我的意識當中 假如一行兩個塊元素,其中乙個元素float:left,那麼兩個元素在一行,並且重疊,將內容擠出來,其實不然, 第乙個元素float:left,第二個元素會與第乙個元素重疊,也就是在一行,但是如果是第二個元素float,第乙個元素是塊元素會獨佔一行,第二個float元素會被擠到第二行(重重重,以前不知道),所以上面題的第一問,header為塊元素獨佔一行, 而aside為浮動元素,main元素會擠上來,並且重疊(重疊問題可以使用bfc或者直接用margin)我的解決方式,是解決了問題,可是都不算完美

position: relative;

}#side

#main

更完美的的方式(或許不能稱更完美,只是想到了一些平時布局不會去用的方式,而它卻比較使用)

/* css here */

position: relative;

}#side

#main

#footer

思考:絕對定位同時給left和right或者top和bottom可以解決寬度和高度問題(寬高不定,margin正負值,定位等都能影響寬高)。絕對定位之後塊元素的寬高將根據內容撐開。
/*css here*/

display: flex;

flex-wrap: wrap;

}#header, #footer

#side

#main

暫無

#main li

#main li:nth-of-type(2n)

思考:nth-of-type() 和 nth-child()的區別,為什麼使用nth-child()不行。
document.queryselectorall('ul')[0].addeventlistener('click',event => 

});

思考:事件委託

前端面試 前端面試題300道

jsonp是如何產生的 1 乙個眾所周知的問題,ajax直接請求普通檔案存在跨域無許可權問題,甭管你是靜態頁面 動態頁面 web伺服器,wcf,只要是跨域請求,一律不准。2 不過我們又發現,web頁面上呼叫js檔案時則不受是否跨域的影響 不僅如此,我們還發現凡是擁有 src 這個屬性的標籤都擁有跨域...

一道面試題

一道面試題 射擊運動員10發打中90環有多少種可能,請編寫程式計算出來,並列印出結果,0環和10環均有效。打中90環就是沒打中10環,所以打中90環跟打中10環的可能性是一樣的。然後開始遞迴狂打槍,一到10就記錄 if params i 10 在迴圈的控制中已經排除了大於10的可能性 i 10 pa...

一道面試題

前些時候在找工作,就在準備結束此次找工作歷程的時候,去了一家公司面試,去了之後技術經理直接帶到一台電腦旁,給了一張紙條,上面是這樣的題目 用c或c 來實現 1 建立一棵樹,該樹的深度是隨機的,每個節點的位元組點數是隨機的。2 給每個節點分配一段隨機大小的記憶體空間,給每個節點賦乙個隨機數。3 遍歷這...