首頁  >  文章  >  web前端  >  css樣式圖片、漸層、相關知識總結

css樣式圖片、漸層、相關知識總結

高洛峰
高洛峰原創
2017-03-07 14:22:251286瀏覽

一,background-position:(圖片定位)

三種寫法:

1):依%比,左上角最小(0%,0%),右下角最大(100%,%100);
2):(x,y)左上角最小(0,0),右下角最大(max,max);
3)top,center,left,right,bottom;

二,background-clip:

##1,包含那部分的值:border;padding;content;


三,background-origin:

##1,從那一部分值開始:border;padding;con tent;

四,背景圖像是否固定或隨著頁面的其餘部分滾動。




1,scroll:隨著頁面的其餘部分滾動
2,fixed :固定在視窗的某個位置。

五,漸層:


1,線性漸層:linear-gradient:

1)如果是角度:角度,過渡色;

2)如果是top。 。 。 ,方向前加to,後過渡色;

2,迳向漸變:radial-gradient:###1)預設為中心點漸變;###2)[size at left top]:其中size是漸變半徑。 ######3,重複漸層:######1)重複線性漸層:repeating-linear-gradient:格式跟線性漸層一樣。 ###2)重複迳向漸層:reoeating-radial-gradient:格式跟迳向漸層一樣。 ######以上這篇css樣式圖片、漸變、相關小知識(必看)就是小編分享給大家的全部內容了,希望能給大家一個參考,也希望大家多多支持PHP中文網。 ######更多css樣式圖片、漸層、相關知識總結相關文章請關注PHP中文網! ###
陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn