最佳 CSS 3D 按鈕產生器__Button X 操作心得
使用 CSS 語法產生的按鈕，要做的好看不容易；然而圖片式的按鈕雖然畫面呈現較佳，卻需要花費 http 請求時間，也就是會影響網頁載入速度。如果可以的話，使用 CSS 按鈕會是最佳選擇。 網路上有許多線上 CSS 按鈕產生器，可以讓我們輕易取得不少漂亮的按鈕。而本篇要介紹的 ...
繼續閱讀全文Blogger 文章標題最佳化﹍(1) 超連結與 CSS 調校
Blogger 文章標題在預設的狀態下，於首頁可以點擊代表文章網址的超連結。但進入文章頁面後，文章標題就只剩下文字的功能，無法再點擊。如果以站長的角度來看，這不是什麼大不了的事，不過以訪客的角度而言，情況可能略有不同。 以 WFU 的經驗，逛到一篇質量不錯的文章，想保存、分享...
繼續閱讀全文[教學]Blogger導覽列下拉選單﹍安裝懶人包
![[教學]Blogger導覽列下拉選單﹍安裝懶人包](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgZnZTybM-p7kNN0kwqq0i9ihwYlMmUfzSv7EOv3r1VWsqxnbKz59LZ7JXbQgvUdQjrOPI2twEBxlrMEZz5Qplt-v2CtAP6OPKeuivQwlfia6Dmcpwc6ojQQG0GirR-wzAyuW0x-LCUce2i/s1600/drop-down-menu.jpg)
「下拉選單」是個從部落格建立以來便很想要的功能，不過大部分下拉選單除了安裝方式不容易，通常需要有 HTML 基礎才比較能成功；且另外比較麻煩的是，下拉選單很難具備管理性，也就是日後想調整選單內容、順序時，是個不太輕鬆的工程。 以上便是這篇安裝懶人包的源由，使用這個工具沒有語法...
繼續閱讀全文將網頁文章的圖片全部套用立體陰影效果__CSS技巧
(設計: +Totoa Hari , 素材: goo.gl/x6WzZC ) 如能善用 CSS 語法，不需要使用影像編輯軟體，也能讓圖片輕鬆做出「外框 + 陰影」的效果。不過使用 CSS 做出簡單的陰影很容易，要做出不錯的立體感就稍微困難一些。 另外，要在單一圖片使用 CS...
繼續閱讀全文部落格聖誕節裝飾實作 (CSS 技巧)
(Pic from: xox520.blogspot.com ) 聖誕節到了來應應景，為自己的 Blogger 裝飾一下增添點節慶氣氛。 +Mark X 整理了一個「 懶人包工具 」，不但容易安裝且設計精美、深具巧思，按下星星後不但會變色，還會隨機播放聖誕音樂。因此決定以此小...
繼續閱讀全文Blogger 文章置頂+首頁公佈欄實作技巧
(Pic from: psdgraphics.com ) 過去在「 Blogger 小技巧 」曾整理了一些公佈欄的筆記，以備實作時參考之用。一般而言，在 Blogger 要找到一個區塊能長期置頂實現公告的功效，大致有以下這幾個作法： A. 放在導覽列上方 B. 放在文...
繼續閱讀全文[教學]讓網頁使用各種特殊文字區塊__(2) 實作範例「公告+修訂區塊」(CSS 技巧)
![[教學]讓網頁使用各種特殊文字區塊__(2) 實作範例「公告+修訂區塊」(CSS 技巧)](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh617Kqcwh7ASudzV_mVxuz7SBWh4VjPULq_BLF_QjleJR-HvKr_mRhPhxnFjcN25i6DrriY7KHKbdXjskfe0x7vVMOH3PuWy_ZZGdB4aJZRm3f-d7KClRhANdc6UJeCOKT5tsFO9B4RZT2/s1600/important.jpg)
(Pic from: psdgraphics.com ) 寫完「 第一篇 」後，覺得內容稍微硬了一些，如有個實作的例子相佐會比較容易吸收，奈何文長已經無法再塞入舉例內容，因此就把實例留到本篇了。 一般文章常見的特殊文字區塊有公告區、修訂(增補、註釋)區、參考資料區等等，而本...
繼續閱讀全文讓網頁文字使用各種底線圖案__(2) 找出行高的簡易方法
一、找出行高值的困難性 「 上一篇 」製作底線圖案的一個重要步驟為找出「行高」line-height 的像素(px) 值，如此底線圖案才能正常顯示。不過經由上一篇【留言 #04】、【留言 #05】的提問，才赫然發現這個 line-height 的 px 值似乎沒這麼好找。 ...
繼續閱讀全文[教學]讓網頁使用各種特殊文字區塊__(1) 安裝與使用 (CSS 技巧)
![[教學]讓網頁使用各種特殊文字區塊__(1) 安裝與使用 (CSS 技巧)](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgZ78tHy6h3m4gNt3wAxHUKpVrgLhsu1bMbcmT19EAuf66frnevA9wAXrFQmoLxJ-q8h44Ubh-4y6eSE3NQ3jwSkicUu6Jo45RXpHG3o1tu_XR9B3EXPfC6ujz4y6Ndr7gAc0vRQn8k0O1s/s1600/board.jpg)
(Pic from: youtoart.com ) 在我的「 Blogger 文章相關工具及技巧(筆記) 」 → 「美化文章內容」區塊記錄了一些 "標示特殊文字區塊" 的文章，例如標示 "程式碼"、"重點筆記"、&qu...
繼續閱讀全文[教學]讓網頁文字使用各種底線圖案__(1) 安裝與使用 (CSS 技巧)
![[教學]讓網頁文字使用各種底線圖案__(1) 安裝與使用 (CSS 技巧)](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiDDaAhrD5srZojohjvbhxwC2XnjrjGud5N9bNftVLCK_PfuUHmvAr6UhAV1tjIKMfwm8QpN39wLVC_l82EPRGOzPxQ5uwsvELzGarZgp5zVeMnxf7kijnO8cODHuMUKMnZvmtmbu74wldH/s1600/underline.jpg)
以文字內容為主的部落格，先天上吸引目光的能力已經輸旅遊、美食、攝影等以圖片為主的部落格一大截，如果整篇文章都是密密麻麻的文字，那麼再有深度的內容，也會如同嚴肅的講課內容一般，讓人昏昏欲睡。 幫純文字上色、讓文章的可看性加點分大致有兩個途徑，一個是改變標題、關鍵字的顏色，另一個...
繼續閱讀全文
