滿版圖片背景、影音背景

本篇大綱:本篇要解決的問題、滿版背景圖、滿版影音背景。最近遇到頁面的第一屏是滿版影片當背景的設計稿,原本以為只是偶爾有的樣式,後來看到朋友做別的案子時也有一樣的設計,才想把這次寫滿版影片的方式給筆記起來。

製作RWD email 工具:MJML,如何使用及注意事項

本篇大綱:本篇要解決的問題。安裝 MJML。開始使用。MJML 程式碼,寬度、CSS、Style、一般的 a 標籤。整理注意事項的原始碼。用完 MJML 這套 RWD email 工具後深深覺得,終於得到一套 +8 精煉的對抗 Outlook 的神器了!

用Firebase、Google Apps Script、GTM自己做一個讚按鈕

用Firebase、Google Apps Script、GTM自己做一個讚按鈕 本篇大綱:為什麼要自己開發一個按鈕、按鈕樣式部份、按鈕功能部份、判斷使用者語系、在google apps script上寫API、cookies、發Google Analytics事件、埋程式碼html、css、js、結論

用純css寫的網頁預覽效果

覺得可以用在歷年回顧或是頁面預覽的區塊上使用,就自己寫了一個。預設div的寬高就用width/padding的css特性直接做一個正方形處理。而捲動的效果直接用background-position來處理。結合以上2點,實際上會寫到的css沒幾行,如下…

Google Material Design 表單標籤效果

自從Google設計了Material Desgin後,除了按鈕的漣漪效果讓人驚豔外,表單label跟input的結合方試也跟著讓很多人「致敬」。最近想用Netflix追劇,在註冊的時候,就發現他們的表單就是用了一樣的效果,想想Google的設計連Netflix都在用了,看來是個好設計,就決定自己來寫一個。