CSS 陰影：box-shadow 和 drop-shadow 的差別
簡單的說就是如果圖片是不規則的透明背景 .png 檔，想要順著圖形的形狀產生陰影，就要使用 drop-shdow 而 box-shadow
2023-09-08
用 CSS 調換 DVI 順序：order
在很多時候我們會需要改變元素的順序，如果是自己寫的網站，當然很簡單。但是如果是在像 WordPress 裡面，較方便的做法是用 CSS 去改
2022-01-20
2021-11-30
Javascript toggle & CSS 範例1
觸發JS 常用的方式有 onMouseover onMouseout onClick onfocus onMouseover onMouse
2021-12-21
2021-11-16
CSS animation 動畫效果
.ok{ animation-delay:2s;/*延遲幾秒才開始播放*/ animation-direction:alternate;/*
2021-11-23
2021-10-25
製作 Back to Top 按鈕
外掛「Head, Footer and Post Injections」 可以在每個頁面插入一段 HTML 或是 CSS, Javascri
2021-10-25
用 javascript 觸發 CSS 屬性
例子1 :https://www.daconote.com/sample/javascript-trigger-CSS.php 例子2 :h
2020-05-20
CSS: transition 轉場/過場
transition 最常使用在滑鼠移到物件上時 (hover) 觸發的變化。 ▼比如說如下例子，當滑鼠移上去時人物會「立即」以Y軸為軸心旋
2021-11-30
CSS 各種變形 transform
transform 屬性 transform 語法用來翻轉區塊，但不適用於「行內元素」(inline element)，除非把行內元素設定為
2022-12-06
行內元素 inline element 和區塊元素 block element 的差別
最常見的「行內元素」(inline element) 是 <span> ，而相對於行內元素就是「區塊元素」(block elem
Read More » 2020-05-16
最常見的「行內元素」(inline element) 是 <span> ，而相對於行內元素就是「區塊元素」(block elem
CSS 遊戲，邊玩邊學，包含 flex, grid 的遊戲
CSS Dinner CSS Dinner 是一款關於 CSS 選擇器套用語法的遊戲。 要通過關卡你可能需要這一篇裡面的 CSS 知識：選擇
2021-08-16
CSS 偽元素：before, after
before, after 如果你是用 WordPress 架設網站，before, after 這偽元素將會非常有助於調整版面的細節。比之
2021-11-12
CSS 語法 16：彈性排版 flex
彈性排版 flex flex 或 flexbox 是 CSS 排版的大怪獸，只要學會這幾行 CSS ，就可以取代許多 CSS 的排版框架。尤
2021-12-21
CSS：書寫方向 writing-mode
書寫方向 writing-mode 雖然網頁的文字方向大都是水平由左至右，但如果因為種種原因想要由上到下，由右至左，也是有方法的。 writ
2020-03-05
CSS 語法 19：滑鼠游標 cursor
鼠標 cursor 改變滑鼠游標？這是是90年代的網頁設計流行嗎？可能是用行動裝置瀏覽網頁已經是主流，而手機當然是沒有鼠標這種東西，CSS
2020-03-05
CSS語法18：對齊 align、 text-align
對齊( align, text-align ) text-align text-align 用來定義文字的對齊規則 text-align:l
2021-08-16