CSS3選擇器「:nth-child()」與「:nth-of-type()」用法大不同[轉載自梅問題教學網]-技術分享-網頁設計,專案開發,網頁設計作品-傑立資訊網頁設計公司

CSS3－:nth-child()
當網頁中有4個p標籤時，可用nth-child的方式，來進行選擇，當下odd表示，只要是單數列背景就會套用成淺灰色。
梅問題－CSS教學－CSS3選擇器「nth-child與nth-of-type」大不同

這時候只要是奇數列的p標籤，背景就會變成淺灰色，在這種情況下，即便使用nth-of-type也會得到一樣的效果。
梅問題－CSS教學－CSS3選擇器「nth-child與nth-of-type」大不同

改變一下網頁的架構，把p標籤下方，加入<hr>來將區塊與區塊間來畫一條。
梅問題－CSS教學－CSS3選擇器「nth-child與nth-of-type」大不同

這時就會看到，全有p標籤的背景都變成淺灰色的了。
梅問題－CSS教學－CSS3選擇器「nth-child與nth-of-type」大不同

原因就出在，當使用nth-child時，它並不是只篩選p標籤，而是網頁中的所有標籤都會一起計算，所以可看到，這時所有的p就變成奇數列了。
梅問題－CSS教學－CSS3選擇器「nth-child與nth-of-type」大不同

CSS3－:nth-of-type()
這時只要把原本的nth-child改成nth-of-type，就只會針對網頁中的p標籤進行篩選。
梅問題－CSS教學－CSS3選擇器「nth-child與nth-of-type」大不同

鏘~鏘~這時候就只有在奇數列的p標籤的背景才會套用淺灰色。
梅問題－CSS教學－CSS3選擇器「nth-child與nth-of-type」大不同

新竹市輔具資源中心無障礙輔具租借回收評估網

企業形象網站.無障礙網頁 / 服務類

響應台灣無障礙的生活的理念，各地輔具中心皆有相關設備提供民眾租借使用以解決生活中的不便利。
網站把主要功能以大區塊的方式呈現，民眾可以快速尋找想要的輔具工具，點選後直接進到申請頁，簡易又明確的流程協助民眾完成租借流程。

Tripbaa趣吧旅行社國內外觀光旅遊及飯店民宿規劃平台

精選專案.網頁設計.RWD響應式網站 / 戶外旅遊類

網站技術：PHP . Javascript/MS-SQL

不論是個人、情侶、好友或是家庭想要安排一場獨一無二的旅遊!!趣吧有滿滿的夢幻行程可以滿足，機票、包車、住宿、票劵一次搞定；想要出國怕語言不通，也有專業達人協助。讓你擁有一場難忘又滿足的旅遊。

CSS3選擇器「:nth-child()」與「:nth-of-type()」用法大不同[轉載自梅問題教學網]