金魚都能懂網頁設計入門 : Animation 網頁動畫 - 鐵人賽第十九天 | 網頁動畫 | 網頁教學 | CSS教學 | animation

網頁教學如此淺顯易懂，就是金魚都能懂的網頁設計入門啦
animation 動畫是我們在製作網頁時製作較為複雜動畫的一個選項，要做到複雜的話可以很複雜，可設定的值也多達8個，今天就跟著 Amos 來看看簡單的 animation 基礎吧。
歡迎Line搜尋『@CSScoke』加入Amos公開帳號
#網頁動畫 #animation #CSS教學 #網頁教學 #網頁設計 #CSScoke
本影片同步發表於 2019 iT 邦幫忙鐵人賽
ithelp.ithome....
Line搜尋「@csscoke」加入CSS可樂公開帳號，可以收到 Amos 第一手資訊喔
👍若你喜歡我的影片，歡迎利用下方任一方式斗內支持我，謝謝您
💰打賞 AMOS 喝杯咖啡
❤️街口支付 901377766
❤️綠界 p.ecpay.com.tw...
❤️歐付寶 tinyurl.com/am...
完整版30集 - 金魚都能懂網頁設計入門
• 金魚都能懂的網頁設計入門
阿莫師の網頁料理室
• 阿莫斯の網頁料理室
大師常來聊
• 大師常來聊
超入門 - 金魚都能懂的網頁教學(2HR)
• 超入門 - 金魚都能懂的HTML教學-Par...
Bootstrap3 CSS原始碼導讀
• Bootstrap
背景圖片來源
unsplash.com/p...
■□■□■□■□■□■□■□■□■□■□■□■■□■□■□■■□■□■□■□■□■□■□■□■
每周二晚上直播 / csscoke
■□■□■□■□■□■□■□■□■□■□■□■■□■□■□■■□■□■□■□■□■□■□■□■
訂閲看最新影片 goo.gl/nXQfZG
■□■□■□■□■□■□■□■□■□■□■□■■□■□■□■■□■□■□■□■□■□■□■□■

[@eric_cho]

感謝大大的教學

[@katyln4065]

老師！請問我可以使用animation在a:hover做出從左至右border-bottom是可行的嗎？ 可以代替偽元素的做法嗎？

[@MsStarstarbear]

好有趣^O^

[@CSScoke]

超好玩~

[@sunliker77]

真有意思, 如果我有十個圓形按鈕, 我想隨機表現十個按鈕各有不同比分比的填滿效果, 這會難倒你嗎?(隨機參數可指定)

[@CSScoke]

我可以利用CSS做假隨機，但真的要隨機的話，還是用程式會比較適合
你說的填滿我看不懂是啥就是了
這邊就是一個假隨機的應用案例
ruclips.net/video/PlPujYrVLTY/видео.html

[@sunliker77]

@@CSScoke 你好, 想不到能得到回應, 太感動了, 我說的填滿是指依百分比來給按鈕上色, 50%的就填滿一半, 70%就填70%的色, 因為我最近在做Canvas 製作動態進度載入水球的案子, 效果不理想也很繁複, 而且水球同時顯示太多(30個)可能也會有問題, 你的教學我每集都看到到19實在獲益良多, 非常感謝, 很想知道我的問題是不是有解.
連結我看了, 很精彩的表示, 功力真是大師級的.

[@CSScoke]

@@sunliker77 你找一下「CSS漸層」，應該可以解決你的需求，不然就要等我新書上市（還要一個月＠＠）

[@sunliker77]

@@CSScoke 好的, 謝謝, 新書書名, 一定要買來學習.

[@CSScoke]

@@sunliker77 「金魚都能懂的CSS必學屬性」
回覆你的同時其實正在寫XD

[@muiko9892]

酷:D

[@timchen0607]

Amos大你好
我看人家@keyframes裡面是用from to 這跟設定0%100%是一樣的對吧?只是設定%數可以做比較細的設定

[@CSScoke]

Tim Chen 沒錯！