[問題] CSS3可以有超過兩個pseudo elements嗎

作者: content71 (羅莉飼養中...)   2015-12-16 12:47:36
《前提》
希望全部都在 css 裡面解決
這樣我在 html 裡面只要套用一個 class 就可以重複運用
《目標》
要做一些 border animation
不過 border 有四個邊
pseudo elements 我所知只有 :before, :after 兩個
請問有辦法設定四個嗎
範例如下
http://codepen.io/anon/pen/PZZQog
(範例裡面只有上下邊,但我想多做左右邊)
作者: iamnodoubt (Have Fun)   2015-12-16 23:16:00
就只有兩個,最接近你要的可行性解法是,把svg放進pseudo的content,然後改變stroke-dashoffset去做動畫跟做svg動畫是一樣的,只是svg跟一般dom的選取起來操作有點不太一樣就是了,其實一個div做出很多樣的圖型,除了pseudo元素之外, 很多都是用box-shadow去模擬出來的當然可以啊,如果你觀念有通的話,parallax原理你有辦法手刻的話,說真的,你要畫面酷炫,又要簡單辦到,沒這回事很多動畫都是苦工時間累積出來的...

Links booklink

Contact Us: admin [ a t ] ucptt.com