通過3D轉換效果產生的互動的幻燈片。按向左或向右箭頭鍵切換,全屏觀看會有更好的效果。
2. CSS Diner
通過一個簡單的小遊戲讓你學習CSS selector,輸入正確的selector來完成每一關。你也可以通過選單來選關。
3. CSS Selectors 互動
這是一個簡單視覺化CSS選擇器。選擇左邊選單中的選擇器,選擇的條目就會出現在右邊。
4. 前端Web開發考查
CSS 屬性有大小寫之分嗎?
5. The Magic of CSS
這裡有6個章節的CSS教程,更深入的教程會慢慢開放。
6. Enjoy CSS
一個學習CSS的聖地,它專注於CSS。
7. CSS Guidelines
Harry Roberts 已經更新了他的開放資源。之前只是GitHub上的一個庫,現在已經有了自己的域名,並且優化並更新了很多資源。
8. CSS Triggers…
Chrome開發者Paul Lewis創造了一個頁面解析參考,當給定的CSS屬性變更時它會發揮自己的作用。例如,一些屬性將觸發重繪和合成,但不會引釋出局。我們可以很容易地通過CSS Triggers來發現這些變化。
9. mdo貢獻的程式碼指南
Bootstrap’s的Mark Otto 整理了他自己風格的HTML和CSS指南,這些建議包括屬性的順序,順序的HTML屬性選擇器等等。
10. Flexplorer
這是一個簡單的應用,用來來擺弄各種flexbox特性並檢視出現在頁面上的實時的完整程式碼。它有一個很酷的特性,你還可以通過它來編輯頁面上的文字框,允許您看到這些變化是如何影響其它內容的。
11. CSS Selectors: Targeting HTML Like a Pro
Russ Weakley的新課程,是SitePoint的姐妹網站,這裡有超過20個視訊介紹的CSS的Selector元素。這不僅僅是一個簡約的外掛,而且作業是一個真正的CSS專家。所以如果你剛剛開始用CSS和還沒掌握選擇器,這可能是一個不錯的選擇。
總結
不管你的CSS水平如何,我可以保證這些東西肯定能幫到你,如果你手上有正在進行的相關專案,或是其它不錯的資源可以拿出來和大家一起分享。
相關閱讀
評論(2)