亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

Dreamweaver中CSS怎么制作徑向圓形漸變?

百度經(jīng)驗(yàn)   發(fā)布時(shí)間：2018-08-01 09:52:23   作者：yangxin_25   我要評(píng)論
Dreamweaver中CSS怎么制作徑向圓形漸變？Dreamweaver中可以利用DIV+CSS制作圓形漸變效果，今天我們就來(lái)介紹五種簡(jiǎn)單的制作方法，需要的朋友可以參考下

Dreamweaver設(shè)計(jì)網(wǎng)頁(yè)很簡(jiǎn)單，今天我們就來(lái)看看利用CSS來(lái)繪制圓形徑向漸變的方法，可以通過(guò)【 radial-gradient】來(lái)實(shí)現(xiàn)，下面分享五種方法，請(qǐng)看下文詳細(xì)介紹。

第一種：基礎(chǔ)簡(jiǎn)單漸變

1、我們先建立個(gè)網(wǎng)頁(yè)，并寫(xiě)入<div></div>標(biāo)簽，并引入CSS樣式。

2、定義IDV的寬和高，然后利用背景漸變來(lái)實(shí)現(xiàn)漸變【width: 400px; height: 400px;background: radial-gradient(yellow, red);】。

第二種：簡(jiǎn)單的圓形漸變

通過(guò)如下代碼也可以實(shí)現(xiàn)，幾乎和第一種一樣。

【width: 400px; height: 400px;background: radial-gradient(circle, yellow, red);】

第三種：指定圓形漸變的起始位置

1、可以通過(guò)如下代碼實(shí)現(xiàn)。

【  width: 400px; height: 400px;background: radial-gradient(circle at 50px 50px, yellow, red);】

2、指定起始位置也可以使用百分比來(lái)實(shí)現(xiàn)起始位置。

【width: 400px; height: 400px;    background: radial-gradient(circle at 12.5% 25%, yellow, red);】

第四種：指定終止點(diǎn)位置

【width: 400px; height: 400px;    background: radial-gradient(closest-side circle at 50px 50px, yellow, red);】

第五種：指定漸變顏色斷點(diǎn)

1、為了方便經(jīng)驗(yàn)的朋友們觀察，加了個(gè)邊框可以看出效果。

【width: 400px; height: 400px;    border: 1px solid silver;    background: radial-gradient(closest-side circle, yellow, orange, red, white);】

以上就是Dreamweaver圓形漸變色的制作方法，希望大家喜歡，請(qǐng)繼續(xù)關(guān)注腳本之家。

相關(guān)推薦：

Dreamweaver怎么繪制視化表格?

Dreamweaver中怎么鏈接本地視頻?

Dreamweaver怎么怎么利用層布局網(wǎng)頁(yè)?

相關(guān)文章

最新評(píng)論