2014年8月31日

完整文章位於 OXXO.STUDIO 新網站
點選閱讀完整文章:
http://www.oxxostudio.tw/articles/201408/css-vertical-align.html

摘要:
我們在編輯一個版面,通常都會用到水平置中和垂直置中來設計,而水平置中很好處理,不外乎就是設定 margin:0 auto;或 text-align:center;,就可以輕鬆解決掉水平置中的問題,但一直以來最麻煩對齊問題,都是「垂直置中」這個討人厭的設定,以下將介紹三種單純利用 CSS 垂直置中的方式:「設定行高」、「添加偽元素」、「calc 動態計算」,其實一點也不難 ( 當然跟水平置中比起來難了一點 ),只需要觀念正確就可以解決。

2014年8月30日

完整文章位於 OXXO.STUDIO 新網站
點選閱讀完整文章:
http://www.oxxostudio.tw/articles/201408/sticky-ball.html

摘要:
這是一個純粹利用 CSS 所做出來的效果,這個效果說穿了就是一個影像處理的原理,做法跟 Photoshop 裡頭的幾乎一模一樣,只是一個用圖層和色版來製作,一個則是用 CSS ( 把 div 當成圖層思考就好了 )