frontend 對於 css 要懂哪些，以下對於常用的開發項目列出一個列表，大家可以自己去找找答案，以及還沒有包涵在範圍內的部份。

對於大部分人，都會覺得 css 是一個很簡單的裝飾語法，也因為他沒有辦法進行邏輯判斷，沒有辦法進行程式計算（不加入 compass 的前提下）基本上他就是一個很簡單的語法，實際上在真正前端開發時，如果真的要強調於細節，強調於很多深入的部份，幾乎可以花去很大的功夫先從 html 特性，到 css 語法，甚至到如何命名等，都可以是一個很有趣的專題。

這邊先列出幾個對於一個前端工程師 front end engineer 需要了解的 css 項目，做介紹。

CSS

• how import css style
• css 權重, file, internal, important, inline attribute.
• tag, id, class
• box, inline mode
• position, absolute, relative. 差異
• float, clearfix
• margin, padding 差異
• width, height 計算方式
• font style
• image
• background, and include background image
• color, RGB, RGBA
• font size
• line-height
• 基礎單位 px, em, %
• opacity
• z-index
• 物件水平置中
• media query

more CSS

• 每一種 html tag 基本 display 屬性, span, div
• other select, nth-child, * > , ^
• :: pseudo, ex, ::hover, ::target
• display, none, inline-block, table-cell …
• parent and child relation, and position relative
• css animation, transition
• background image style
• 物件垂直置中。
• 混搭狀況下，權重覆蓋行為

在 more css 的部份，這邊大部分都是屬於更經驗談的部份，在實際開發中，有更多 css 的實際操作經驗，會讓自己省下許多事情，也讓自己能夠在提到某些問題的時候，可以自動腦補上去可能會發生的狀況。

這只是針對 css 的部份，事實上，還有更多更多關於 css 的問題，以及現在有

許多有趣的特效都可以利用 css 做到，對於 front end 這個工作，我們要再次強調，它根本就是一個

『坑』

.

.

原文於熱血漢誌