好程式設計師web前端分享css學習:hsla顏色模式
一、理論:
1.hsla顏色模式
a.hsla在hsl基礎上增加了不透明度,值越大透明度越低
b.hsla顏色模式的瀏覽器相容性和hsl一樣,只有較新版本的主流瀏覽器才支援
2.rgba和hsla顏色模式二者可以完全相互替換
3.rgba/hsla的ie相容方案
a.在ie8以下版本,一般在前面設定乙個非透明色,在其後緊跟乙個rgba/hsla顏色模式
b.將透明的png平鋪做為背景,適用於ie7-8
c.使用gradient濾鏡可以指定半透明顏色,將起止色設定為同一種顏色即可避免產生漸變
二、實踐:
1.1
0.8
0.6
0.4
0.2
1 0.8
0.6
0.4
0.2
1 0.8
0.6
0.4
0.2
1 0.8
0.6
0.4
0.2
1 0.8
0.6
0.4
0.2
好程式設計師web前端技術分享css盒模型
web前端技術分享css盒模型 學習目標 一 css盒模型的概念及組成 概念 盒模型是css布局的基石,它規定了網頁元素如何顯示以及元素間相互關係。css定義所有的元素都可以擁有像盒子一樣的外形和平面空間.盒模型的組成 邊框 邊界 邊距 補白 填充 內容區。二 盒子模型的相關元素 說明 填充 pad...
好程式設計師web前端分享CSS3 邊框
好程式設計師web前端分享css3 邊框,通過 css3,您能夠建立圓角邊框,向矩形新增陰影,使用來繪製邊框 並且不需使用設計軟體,比如 photoshop。在本章中,您將學到以下邊框屬性 border radius box shadow border image 瀏覽器支援 internet ex...
好程式設計師web前端技術分享css盒模型
web前端技術分享css盒模型 學習目標 一 css盒模型的概念及組成 概念 盒模型是css布局的基石,它規定了網頁元素如何顯示以及元素間相互關係。css定義所有的元素都可以擁有像盒子一樣的外形和平面空間.盒模型的組成 邊框 邊界 邊距 補白 填充 內容區。二 盒子模型的相關元素 說明 填充 pad...