css3繪製月牙效果程式碼例項
分享一段程式碼例項,它實現了繪製月牙的效果。
程式碼例項如下:
[HTML] 純文字檢視 複製程式碼執行程式碼<!doctype html> <html> <head> <meta charset="utf-8"> <meta name="author" content="http://www.softwhy.com/" /> <title>螞蟻部落</title> <style type="text/css"> .moon { width: 150px; height: 150px; border-radius: 50%; box-shadow: 15px 15px 0 0 green; } </style> </head> <body> <div class="moon"></div> </body> </html>
程式碼比較簡單,更多內容可以參閱相關閱讀。
相關閱讀:
(1).border-radius參閱CSS3 border-radius一章節。
(2).box-shadow參閱CSS3 box-shadow一章節。
相關文章
- canvas繪製圓環效果程式碼例項Canvas
- CSS3繪製菱形程式碼例項CSSS3
- canvas繪製箭頭效果程式碼例項Canvas
- jQuery繪製網格效果程式碼例項jQuery
- canvas繪製夜空小屋效果程式碼例項Canvas
- canvas繪製鐘錶效果程式碼例項Canvas
- canvas繪製橢圓效果程式碼例項Canvas
- css3繪製谷歌圖示程式碼例項CSSS3谷歌
- canvas繪製魚吃豆效果程式碼例項Canvas
- canvas繪製雪花飄落效果程式碼例項Canvas
- CSS3繪製平行四邊形程式碼例項CSSS3
- css3繪製QQ企鵝圖示程式碼例項CSSS3
- css3繪製心形圖案程式碼例項CSSS3
- CSS3繪製太極圖程式碼例項詳解CSSS3
- css3繪製柳樹葉形狀程式碼例項CSSS3
- css3星空效果程式碼例項CSSS3
- css3水滴效果程式碼例項CSSS3
- CSS3 名片效果程式碼例項CSSS3
- canvas繪製扇形程式碼例項Canvas
- canvas繪製星星程式碼例項Canvas
- canvas 繪製雞蛋程式碼例項Canvas
- CSS3小黃人效果程式碼例項CSSS3
- css3晃動效果程式碼例項CSSS3
- CSS3心形效果程式碼例項CSSS3
- CSS3旋轉效果程式碼例項CSSS3
- CSS3彈球效果程式碼例項CSSS3
- canvas繪製網格程式碼例項Canvas
- css繪製圓形程式碼例項CSS
- svg繪製半圓程式碼例項SVG
- canvas繪製笑臉程式碼例項Canvas
- CSS3滑過光束效果程式碼例項CSSS3
- css3折角效果程式碼例項CSSS3
- CSS3梯形效果程式碼例項CSSS3
- CSS3背景漸變效果程式碼例項CSSS3
- css3立方體效果程式碼例項CSSS3
- css3優惠券效果程式碼例項CSSS3
- CSS3星系運動效果程式碼例項CSSS3
- css3漂浮氣球效果程式碼例項CSSS3