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多程序程式設計中...