CSS排版技巧 - 文繞圖
文繞圖先看效果，這次要做的是文繞圖技巧，可以選擇靠左或靠右。
html結構圖片(img)必須在段落(p)的上面，當圖片加上float:left屬性時，圖片的空間會消失，變成浮在畫面上，利用這個技巧，我們來做到文繞圖的效果。 ...
繼續閱讀
Demo：使用wow.js快速打造捲動式動畫網頁
我用兩個不同方法個別製作出網站來讓大家比較看看：
純CSS打造捲動式動畫網站wow.js打造的捲動式動畫網站
接著來介紹這wowjs的製作方法與其優缺點。
使用方法：第一步要做的是animate.css與wow.js載進網頁中。接著幫要使用 ...
繼續閱讀Demo：使用scrollspy讓畫面更生動
Demo展示頁
作法說明1.幫body加工將body加上display: relative，如果還是不行使用的話加上width: 100%與height: 100%。
123display: relative;width: 100%;hei ...
繼續閱讀排版練習1：PSD to HTML Porfolio
最近在訓練排版的熟練度，要快速打造protype基本的前端技能是必須的。我選擇的教材是tuts的psd to html porfolio。課程中介紹了詳細的切版流程，從切圖到建構html到用css排版都有詳細的介紹。本篇是psd to ht ...
繼續閱讀CSS Dinner - 好玩又有效的 CSS 教學
CSS DinnerCSS Diner 是一個很有趣的小遊戲，你必須使用css來選取桌上扭動的物體，全部26關玩完對 CSS selector 想忘也忘不了。css selector 在 javascript 或是 jQeury 也會用到， ...
繼續閱讀