css3 - 這個效果用 CSS 可以實現嗎？border-image

問題描述

不想切整張圖片，只把兩個小球單獨切出來，因為小球有閃動的效果。用了border-radius: 50%;畫出一個圓，但border-image的小球仍然已正方形來排列。

代碼放在jsbin上http://jsbin.com/redolerota/1/edit?html,...

問題解答

demo

用 CSS 畫就可以哩~https://jsbin.com/vozetu/

圓底和小球邊框分成兩層，小球邊框那一層用:after,罩在上面不就行了，可以不用border-image。。。

并不能，老老實實用圖片就是了，哪里搞這么多東西

border-image好像不支持圓角，或者可以試試canvas繪圖

canvas畫出來

z-index分層試試