亚洲中字慕日产2020,大陆极品少妇内射AAAAAA,无码av大香线蕉伊人久久,久久精品国产亚洲av麻豆网站

資訊專欄INFORMATION COLUMN

background:radial-gradient徑向漸變

gekylin / 2977人閱讀

摘要：用長度值指定徑向漸變圓心的縱坐標(biāo)值。確定圓的類型指定圓形的徑向漸變指定橢圓形的徑向漸變。用百分比指定橢圓徑向漸變的橫向或縱向半徑長度。

background: radial-gradient(shape size at position, start-color, ..., last-color);
= radial-gradient([ [ || ] [ at ]? , | at , ]?[ , ]+)
= [ ① | ① | left | center① | right ]? [ ② | ② | top | center② | bottom ]?
= circle | ellipse
= | [ || ]
= closest-side | closest-corner | farthest-side | farthest-corner
=
= [ | ]{2}
= |
= [ | ]?

確定圓心的位置。如果提供2個參數(shù)，第一個表示橫坐標(biāo)，第二個表示縱坐標(biāo)；如果只提供一個，第二值默認(rèn)為50%，即center

①： 用百分比指定徑向漸變圓心的橫坐標(biāo)值?？梢詾樨?fù)值。
①： 用長度值指定徑向漸變圓心的橫坐標(biāo)值?？梢詾樨?fù)值。
    left： 設(shè)置左邊為徑向漸變圓心的橫坐標(biāo)值。
    center①： 設(shè)置中間為徑向漸變圓心的橫坐標(biāo)值。
    right： 設(shè)置右邊為徑向漸變圓心的橫坐標(biāo)值。
②： 用百分比指定徑向漸變圓心的縱坐標(biāo)值?？梢詾樨?fù)值。
②： 用長度值指定徑向漸變圓心的縱坐標(biāo)值?？梢詾樨?fù)值。
    top： 設(shè)置頂部為徑向漸變圓心的縱坐標(biāo)值。
    center②： 設(shè)置中間為徑向漸變圓心的縱坐標(biāo)值。
    bottom： 設(shè)置底部為徑向漸變圓心的縱坐標(biāo)值。

確定圓的類型

circle： 指定圓形的徑向漸變
ellipse： 指定橢圓形的徑向漸變。

circle | ellipse 都接受該值作為 size

closest-side： 指定徑向漸變的半徑長度為從圓心到離圓心最近的邊
closest-corner： 指定徑向漸變的半徑長度為從圓心到離圓心最近的角
farthest-side： 指定徑向漸變的半徑長度為從圓心到離圓心最遠(yuǎn)的邊
farthest-corner： 指定徑向漸變的半徑長度為從圓心到離圓心最遠(yuǎn)的角

circle 接受該值作為 size

： 用長度值指定正圓徑向漸變的半徑長度。不允許負(fù)值。

ellipse 接受該值作為 size

： 用長度值指定橢圓徑向漸變的橫向或縱向半徑長度。不允許負(fù)值。
： 用百分比指定橢圓徑向漸變的橫向或縱向半徑長度。不允許負(fù)值。

用于指定漸變的起止顏色：

： 指定顏色。
： 用長度值指定起止色位置。不允許負(fù)值
： 用百分比指定起止色位置。不允許負(fù)值

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://www.ezyhdfw.cn/yun/113410.html

相關(guān)文章

  • CSS3徑向漸變radial-gradient實現(xiàn)波浪邊框和內(nèi)倒角

    摘要：表示圓形漸變，說的簡單點就是畫一個圓。表示容器最右邊，表示容器最上邊，換言之就是右上角。實現(xiàn)波浪邊框上代碼，增加一個樣式即可此處沒有字樣，表示原點在容器中心位置，，表示半徑范圍內(nèi)是顏色，半徑到范圍內(nèi)是顏色，半徑大于是顏色。 前言 大佬給了一張優(yōu)惠券圖片(如下圖)，我一看，這波浪型的邊框和內(nèi)倒角用css寫不出來吧，遂向大佬說明并要ui切圖，大佬回答：css3可以實現(xiàn)。好吧，大佬都說可以實...

    王巖威 評論0 收藏0

  • 淺探css3漸變

    摘要：基本用法想要知道線性漸變有什么用，當(dāng)然要先學(xué)習(xí)它的屬性和用法。下面我們先一起學(xué)習(xí)一下線性漸變的屬性。函數(shù)的第一個參數(shù)是角度或者方向，第二個參數(shù)是截止顏色的值，要想產(chǎn)生漸變的效果，當(dāng)然至少要兩個或者兩個以上的顏色值。 css3的漸變屬性已經(jīng)在各種網(wǎng)頁設(shè)計中被廣泛使用，在沒有css3的漸變屬性之前，要實現(xiàn)一些多種顏色切換的效果圖，你可能別無他法，只能用一個圖片來顯示，雖然你知道使用圖片需要...

    lieeps 評論0 收藏0

  • 用純css來實現(xiàn)一個優(yōu)惠券

    摘要：關(guān)于徑向漸變的具體使用可以參考張鑫旭的文章徑向漸變語法及輔助理解案例則那么怎樣實現(xiàn)我們要的效果呢我們先看看徑向漸變的語法徑向漸變由它的中心定義。 查看原文可以有更好的排版效果哦 前言 我們在平時的網(wǎng)頁中，經(jīng)常會見到這樣的優(yōu)惠券或者其他的券（特征就是會有反方向的圓角）。 showImg(https://segmentfault.com/img/remote/146000001570560...

    awkj 評論0 收藏0

  • 前端每日實戰(zhàn)：35# 視頻演示如何把 CSS 徑向漸變用得出神入化，只用一個 DOM 元素就能畫出國

    摘要：效果預(yù)覽按下右側(cè)的點擊預(yù)覽按鈕可以在當(dāng)前頁面預(yù)覽，點擊鏈接可以全屏預(yù)覽?？山换ヒ曨l教程此視頻是可以交互的，你可以隨時暫停視頻，編輯視頻中的代碼。 showImg(https://segmentfault.com/img/bVbfmJt?w=400&h=304); 效果預(yù)覽 按下右側(cè)的點擊預(yù)覽按鈕可以在當(dāng)前頁面預(yù)覽，點擊鏈接可以全屏預(yù)覽。 https://codepen.io/comeh...

    ssshooter 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<