課程
/前端開發
/Html5
/走進SVG
svg circle沒有徑向漸變嗎?有的話 ?如何設置
2017-06-22
源自:走進SVG 3-2
正在回答
<svg xmlns="http://www.w3.org/2000/svg">
<defs>
<radialGradient id="grad3" cx="0.5" cy="0.5" r="0.7" fx="0.5" fy="0.5">
<stop offset="0" stop-color="rgb(20,151,252)" />
<stop offset="0.5" stop-color="rgb(164,105,190)" />
<stop offset="1" stop-color="rgb(255,140,0)" />
</radialGradient>
</defs>
<rect x="100" y="100" fill="url(#grad3)" width="200" height="200" />
<circle cx="500" cy="200" r="100" fill="url(#grad3)" />
</svg>
舉報
SVG是HTML5 中矢量圖的標記語言,學習后掌握更多的干貨
1 回答svg線性漸變
1 回答點擊svg的circle ,并改變circle fill屬性,在手機上改變circle 屬性特別慢
2 回答svg圖形如何設置hover效果:改變顏色
1 回答svg元素設置屬性值
2 回答徑向漸變哦
Copyright ? 2025 imooc.com All Rights Reserved | 京ICP備12003892號-11 京公網安備11010802030151號
購課補貼聯系客服咨詢優惠詳情
慕課網APP您的移動學習伙伴
掃描二維碼關注慕課網微信公眾號
2017-07-07
<svg xmlns="http://www.w3.org/2000/svg">
<defs>
<radialGradient id="grad3" cx="0.5" cy="0.5" r="0.7" fx="0.5" fy="0.5">
<stop offset="0" stop-color="rgb(20,151,252)" />
<stop offset="0.5" stop-color="rgb(164,105,190)" />
<stop offset="1" stop-color="rgb(255,140,0)" />
</radialGradient>
</defs>
<rect x="100" y="100" fill="url(#grad3)" width="200" height="200" />
<circle cx="500" cy="200" r="100" fill="url(#grad3)" />
</svg>