前端面試常考知識點

2022-09-20 13:00:16 字數 2057 閱讀 5711

1.css3的新特性有哪些

點我檢視

css3選擇器 .

css3邊框與圓角

css3圓角border-radius:

屬性值由兩個引數值構成: value1 / value2,值之間用/分隔,value1代表圓角的水平半徑,value2代表圓角的垂直半徑

盒陰影box-shadow:

語法:box-shadow: 水平方向的偏移量 垂直方向的偏移量 模糊程度 擴充套件程度 顏色 是否具有內陰影

css3背景與漸變

重要的幾個:

background-image

語法:backgroundimage:url('1.jpg),url('2.jpg')

background-origin

定義:設定背景影象的原始起始位置

background-repeat

定義:設定是否及如何重複背景影象,預設地,背景影象在水平和垂直方向上重複。

background-size

定義:指定背景影象的大小

語法:background-size:number / % / cover / contain

太多了,本寶寶休息一下再寫

css3過渡 css3變換 css3動畫

2.flex

這篇講的很全

簡單易懂

一方面是在父容器的幾個屬性,另一些就是子元素的屬性

父:* flex-direction 子元素排列方向

* flex-wrap 如果一條軸線排不下,如何換行

* flex-flow flex-direction屬性和flex-wrap屬性的簡寫形式

* justify-content 在主軸上的對齊方式

* align-items 在交叉軸上如何對齊

* align-content 多根軸線的對齊方式

子:* order

* flex-grow

* flex-shrink

* flex-basis

* flex

* align-self

3.bfc

盒模型和bfc

內部的box會在垂直方向,乙個接乙個的放置 每個元素的margin box的左邊,與包含塊border box的左邊相接觸(對於從做往右的格式化,否則相反) box垂直方向的距離由margin決定,屬於同乙個bfc的兩個相鄰box的margin會發生重疊 bfc的區域不會與浮動區域的box重疊 bfc是乙個頁面上的獨立的容器,外面的元素不會影響bfc裡的元素,反過來,裡面的也不會影響外面的 計算bfc高度的時候,浮動元素也會參與計算

怎麼建立bfc

float屬性不為none(脫離文件流) position為absolute或fixed display為inline-block,table-cell,table-caption,flex,inine-flex overflow不為visible 根元素

應用場景

自適應兩欄布局 清除內部浮動

防止垂直margin重疊

為什麼overflow:hidden可以消除margin合併?

我們首先要搞清楚為什麼會發生margin合併。這些元素(包括兄弟、父子元素等)之間之所以會發生margin合併,是因為它們屬於同乙個bfc。所以,我們就知道怎麼辦了,只要讓它們不屬於同乙個bfc不就可以了?通過overflow:hidden建立了乙個bfc

為什麼overflow:hidden可以清除浮動的影響?

當給.parent設定"overflow:hidden"時,實際上建立了乙個超級屬性bfc,此超級屬性反過來決定了"height:auto"是如何計算的。在「bfc布局規則」中提到:計算bfc的高度時,浮動元素也參與計算。因此,父元素在計算其高度時,加入了浮動元素的高度,「順便」達成了清除浮動的目標,所以父元素就包裹住了子元素。

為什麼overflow:hidden...

link、import、require的區別

import和require

require是執行時呼叫,所以require理論上可以運用在**的任何地方

import是編譯時呼叫,所以必須放在檔案開頭

link

和import

前端面試常考知識點 CSS

前端面試常考知識點 js 點我檢視 css3選擇器 css3邊框與圓角 css3圓角border radius 屬性值由兩個引數值構成 value1 value2,值之間用 分隔,value1代表圓角的水平半徑,value2代表圓角的垂直半徑 盒陰影box shadow 語法 box shadow ...

前端筆試面試常考知識點 HTML

1.什麼是html 超文字標記語言 用來設計網頁 由瀏覽器解釋執行 2.doctype作用?標準模式與相容模式有什麼區別?1 宣告位於html文件中的第一行,處於標籤的之前,告訴瀏覽器的解析器,用什麼文件標準解析這個文件,doctype不存在或樣式不正確導致檔案以相容模式呈現 2 標準模式的排版和j...

Linux面試常考知識點

同步 非同步 阻塞與非阻塞 推薦 linux 五種io模型 詳解 linux下五種io模型 關於select poll epoll詳細介紹 分析 select poll epoll 推薦 linux 下i o多路復用區別與優缺點 select poll epoll區別 附 linux多程序程式設計中...