無意間看到了css radial-gradient() 函式實現了如下圖的樣式
仔細一看還真有點像燈光下的雞蛋,o(∩_∩
)o哈哈
~今天我就來用radial-gradient()函式教大家畫乙個簡單的彩虹吧~~~~
語法請參照此鏈結
1.首先畫好結構,也就是在網頁中畫乙個div
2.接著為
div設定
border-radius
為100%
,也就是直徑為
260個畫素,使其變成了乙個圓
3.然後為這個圓,也就是
.box
設定radial-gradient()函式(這裡的moz,webkit字首是為了相容不同核心的瀏覽器)
通過以上3步,我們實現效果如下:
額。。。。。。。。。。。應該沒有人見過如此圓潤的彩虹吧。。。。。。
是的,如果能裁掉一半就perfect了。
其實實現很簡單,我們只需要寫乙個跟背景顏色一樣的div固定在「圓潤彩虹「的下半邊就
ok啦!
完整**如下:
(php開發
,web
前端,ui
設計,vr
開發專業培訓機構,
v
CSS 畫乙個心
效果圖 實現原理 可以把這個心分為兩部分,兩個長方形,分別設定 border radius,transform rotate 設定屬性之後 再次新增乙個,設定相反的 rotate 設定其中乙個的 left 值 就成了 為了看起來有立體感,可以設定左邊的 box shadow cssbodydivdi...
CSS 畫乙個心
效果圖 實現原理 可以把這個心分為兩部分,兩個長方形,分別設定 border radius,transform rotate 設定屬性之後 再次新增乙個,設定相反的 rotate 設定其中乙個的 left 值 就成了 為了看起來有立體感,可以設定左邊的 box shadow cssbodydivdi...
如何用C語言畫乙個聖誕樹?
我使用了左右映象的sierpinski 每層減去上方一小塊,再用符號點綴。可生成不同層數的 聖誕樹 如下圖是5層的結果。基本 來自sierpinski 的實現,字元的想法來自於code golf draw a sierpinski 更新1 上面的是我嘗試盡量用最少 來畫乙個抽象一點的聖誕樹,因此樹幹...