Picasa 圖床的獨家應用:製作 RWD 自適應圖片,讓手機自動載入小圖,加快網頁讀取速度

過去曾在「 加快 Blogger 行動版圖片載入速度的密技 」告訴讀者,Blogger 使用的圖片只要從後台上傳,也就是使用 Picasa 圖床,行動版就會自動改為載入小尺寸的圖片。 因為有這樣的獨家功能,Picasa 只要上傳一張圖片,就會產生手機版尺寸的圖片,我一直認為 ...

繼續閱讀全文

jQuery 日期時間範圍選擇器 Date Range Picker (Bootstrap 外掛)

過去網頁表單要輸入日期不容易,往往得另外裝個外掛,例如基於 jQuery 的套件 datepicker。 而現在的瀏覽器使用 HTML5 已成為標準,Input 標籤內建就有簡易的選擇日期功能,只要加入屬性 type="date" 就可使用,不必另裝外掛...

繼續閱讀全文

Bootstrap 簡易版面實作範例﹍網格+面板+表單輸入+按鈕

Bootstrap 的使用說明內容不少,份量足以出一本書,不過工具書用從頭看到尾的方式來學習,效果不見得比較好。 如同「一圖勝過千言萬語」,從範例中來學習、吸收 Bootstrap,效率會來得更快,印象也比較深刻。 本篇提供一個簡單的小範例,可以熟悉以下這些功能的用法: ...

繼續閱讀全文

前端開發神器 Emmet 快速上手教學整理,減少 HTML / CSS 輸入的麻煩﹍Sublime Text

網頁製作久了就會發現,手刻 HTML/CSS 挺累贅的。就像 jQuery 可以讓 Javascript 寫起來更快、不必糾結瀏覽器相容性問題,「 Bootstrap 」可以縮短網頁版面設計的時間,那麼 HTML/CSS 的輸入,有沒有快速便利的工具呢? 「 Emmet 」(...

繼續閱讀全文

製作網頁表單時,如何讓複雜的配置也能完美對齊﹍Grid 網格系統

如果熟悉「 Bootstrap 」這套 CSS 框架,那麼製作網頁表單不是什麼難事,查閱一下適合表單使用的 class 名稱,就能快速做出美觀、有一定水準的表單。 最近處理一個大型專案,需要製作許多複雜的表單,結果碰上了難題。什麼程度稱為 "複雜" 呢?可...

繼續閱讀全文
TOP