css3簡介
css3新增選擇器
以box結尾
包含box
結構性偽類選擇器
:last-child 選擇器:用於選取屬於其父元素的最後乙個子元素的指定選擇器
:nth-child(n)選擇器:匹配屬於其父元素的第n個子元素,n可以是數字、關鍵字或公式
:nth-last-child()選擇器:匹配屬於其元素的第n個子元素的每個元素,不論元素的型別,從最後乙個子元素開始計數。n可以是數字、關鍵字或公式
:nth-of-type(n):選擇器匹配屬於父元素的特定型別的第n個子元素。n可以是數字、關鍵字或公式
:nth-last-of-type(n):選擇器匹配屬於父元素的特定型別的第n個子元素的每個元素,從最後乙個子元素開始計數。n可以是數字、關鍵字或公式
狀態偽類選擇器
css3常用邊框屬性
box-shadow
text-shadow
css3背景屬性
background-origin: 規定背景的定位區域。背景可以放置於content-box、padding-box或border-box區域。
background-clip: 規定背景的繪製區域
css3漸變屬性
radial-gradient
使用者介面
瀏覽器的私有字首(相容高版本,提前相容)
box-sizing 屬性
content-box:寬度和高度分別應用到元素的內容框;即在寬度和高度之外繪製元素的內邊距和邊框
border-box:為元素設定的寬度和高度決定了元素的邊框盒。也就是說,為元素指定的任何內邊距和邊框都不會改變盒子大小
calc函式 (實現不同單位之間換算),-兩邊要加空格
多列布局
web前端全棧0基礎到精通(祺)10
多欄布局解決方案 document center left right 優化 品質 使用精靈圖 測試檢查 1 做完的頁面要與設計稿進行比對,保證對設計稿 95 以上的還原度。1 頁面模組的完整性,保證頁面不出現模組丟失 尤其是懸浮的側邊欄 彈窗 下拉列表等 2 字型 字型大小 文字顏色的一致性 3 ...
web前端全棧0基礎到精通(祺)13
css3過渡屬性 transition duration 規定完成過渡效果需要多少秒或毫秒。transition timing function規定速度效果的速度曲線。transition delay 定義過渡效果從何時開始。transition屬性簡寫 css3的 transform 屬性 瀏覽器...
web前端全棧0基礎到精通(祺)19
css 語法 filter 本身生效 backdrop filter 下層標籤生效 filter 描述none 預設值,沒有效果。blur px 給影象設定高斯模糊。radius 一值設定高斯函式的標準差,或者是螢幕上以多少畫素融在一起,所以值越大越模糊 如果沒有設定值,則預設是0 這個引數可設定c...