前言

前端面試題這個專欄在最初的創立思想是JS的面試題，當然在后續的持續更新中，我也在想需不需要改變，后來終于在第二版中想加入CSS的面試題(Beta版本)，于是乎第三版也就是本期，正式加入CSS的面試題（一道JS一道CSS，每日小練），后續版本中也會更新JQ/VUE等等其他面試題的噢，博主還在盡力學習和整理，期待你的關注，

第一題（JS）

在這里插入圖片描述

解題思路

采用異步的形式async，再配合普通的for回圈即可，有很多種寫法，比如下面是簡化的寫法

<script>
	async function test(){
		for(let x of list){
			const res = await square(x)
			console.log(res)
		}
	}
</script>

第二題（CSS/3）

如何使DIV居中

這題可謂是經典了，同時也很簡單，有好幾種方式，都要會，并且最好能判斷合適的方法，

回答

一般常見的幾種居中的方法有：

對于寬高固定的元素

（1）我們可以利用margin:0auto來實作元素的水平居中，

（2）利用絕對定位，設定四個方向的值都為0，并將margin設定為auto，由于寬高固定，因此對應方向實作平分，可以實作水
平和垂直方向上的居中，

（3）利用絕對定位，先將元素的左上角通過top:50%和left:50%定位到頁面的中心，然后再通過margin負值來調整元素
的中心點到頁面的中心，

（4）利用絕對定位，先將元素的左上角通過top:50%和left:50%定位到頁面的中心，然后再通過translate來調整元素
的中心點到頁面的中心，

（5）使用flex布局，通過align-items:center和justify-content:center設定容器的垂直和水平方向上為居中對
齊，然后它的子元素也可以實作垂直和水平的居中，

對于寬高不定的元素，上面的后面兩種方法，可以實作元素的垂直和水平的居中，

最后

這是根據互聯網加上自己梳理的知識點，每日一小練，所以文章也會碎片化，同期還有類似PHP學習筆記的那種，如果你不喜歡看這些零散的知識點，那接下來我會收集好我寫的文章再進行整理，一次性看個爽~

寫在最后，如果文章有幫助到你，希望可以給個三連支持一下噢，讓更多人看到這篇文章，

謝謝了你嘞！

在這里插入圖片描述

來自《往期優質文章》

每日一練，整理CSS，JS前端面試題（8）

文章目錄

前言

第一題（JS）

解題思路

第二題（CSS/3）

如何使DIV居中

回答

最后

熱門推薦