隨著IE8逐漸退出舞臺，很多高階的CSS特性都已被瀏覽器原生支援，再不學下就要過時了。

用:empty區分空元素
相容性：不支援IE8

演示

假如我們有以上列表：

我們希望可以對空元素和非空元素區別處理，那麼有兩種方案。

用:empty選擇空元素：

用或者:not(:empty)選擇非空元素：

用:*-Of-Type選擇元素
相容性：不支援IE8

舉例說明。

給第一個p段落加粗：

給最後一個img加邊框：

給無相連的blockquote加樣式：

讓奇數列的p段落顯示紅色：

此外，:nth-of-type還可以有其他型別的引數：

用calc做流式佈局
相容性：不支援IE8

演示

左中右的流式佈局：

用vw狀語從句：vh做全屏滾動效果
相容性：不支援IE8

演示

vw和vh是相對於viewport而言的，所以不會隨內容和佈局的變化而變。

用於unsetCSS重置
相容性：不支援IE

用column做響應式的列布局
相容性：不支援IE9

（完）