搜尋

首頁  >  問答  >  主體

html - 這種圖形如何用css3寫

##

某草草某草草2742 天前859

全部回覆(4)我來回復

  • 为情所困

    为情所困2017-05-24 11:34:06

    css3裡面有個名為倒角的干活

    回覆
    0
  • PHP中文网

    PHP中文网2017-05-24 11:34:06

    雷雷

    回覆
    0
  • 巴扎黑

    巴扎黑2017-05-24 11:34:06

    簡單來講,你需要透過 圓形p元素的border-radius 和 包裹的overflow來實現,至於更深的橘色應該是陰影

    回覆
    0
  • 習慣沉默

    習慣沉默2017-05-24 11:34:06

    真是不好意思,我一直用的firefox,沒想到它對於radial-gradient和chrome還是有不同的。也是我自己理解不夠。

    我又修改了下面的連結。

    ===============

    使用了CSS3變數來控制半徑大小,暫時想不到更簡單的辦法了
    在不向下不相容的路上越走越遠...

    DEMO-New

    ===================================

    詳細請看DEMO,純CSS3實現,沒有添加額外標記,雖然我感覺可擴展性不高,不過繼續改善應該還是可以投入生產中的。

    CSS3的魔法還有很多,不斷深入思考,會想到很多有趣的功能。正如《CSS揭秘》作者那樣。

    DEMO

    回覆
    0
  • 取消回覆