行內區塊(inline-block)可以讓我們可以以行內（inline）的方式呈現，但同時擁有（block）的屬性，不過，在設定寬度上我們可能會遇到一個奇怪的問題：

我們可以使用 CSS Filter 直接在元素上加上濾鏡效果，先來個所有濾鏡效果的呈現 DEMO： See the Pen by 蔡蔡 Mavis (@0430shinyu) on CodePen. 10 種 filter 濾鏡效果filter 效果一共有 10 種，其中最常使用的是第 1 個 blur() 和第 8 個的 opacity()。 1. blur() 模糊效果

透過 filter 我們可以為元素加上不同的效果，像是模糊，色彩偏移等(filter 介紹)。但我們可能會發現一個奇怪的現象： filter 導致 position 失效在這個範例中，我們先設定兩個 .box，再分別在子元素 .box div 加上 position:fixed，第二個.box再單獨設定filter:grayscale(1)。 1234567<div class="

img{ width:50% } 在撰寫 CSS 的時候，我們常會使用到 Margin 和 Padding 來調整元素的位置，而透過簡寫可以讓我們的 CSS 更加整潔。 Margin 和 Padding 的縮寫方式是相同的，有四種寫法：