11個學習CSS實用工具和資源

2021-07-25 08:50:18 字數 1871 閱讀 6228

但是,我們並沒有忘記我們的根:css。

對於那些仍然在學習css,或者想要去一點點深入到具體的css主題的朋友,我想我會將最近幾個月遇到的css學習資源的列表,放在一起。一起來享受吧!

1.展開的盒子模型

通過3d轉換效果產生的互動的幻燈片。按向左或向右箭頭鍵切換,全屏**會有更好的效果。

通過乙個簡單的小遊戲讓你學習css selector,輸入正確的selector來完成每一關。你也可以通過漢堡選單來選關。

3.css selectors 互動

這是乙個簡單視覺化css選擇器。選擇左邊選單中的選擇器,選擇的條目就會出現在右邊。

4.前端web開發簡單測驗

乙個前端編碼測驗,第一部分是css.

這裡有6個章節的css基礎教程,更深入的教程將會在這裡開放。

乙個像codepen一樣學習css的聖地,它只專注於css。你可以在選單中選擇乙個css功能,然後使用 gui 在文件中編輯此功能。

harry roberts 已經更新了他的css準則。之前只是github上的乙個庫,現在已經有了自己的網域名稱,並且已擴充套件和優化。harry還實施了「支付你想要什麼」的模式,以幫助支援發展。

chrome開發者paul lewis創造了乙個頁面解析參考,當給定的css屬性變更時它會發揮自己的作用。例如,一些屬性將觸發重繪和合成,但不會引發布局。我們可以很容易地通過css triggers來發現這些變化。

9.mdo貢獻的**指南

bootstrap』s的mark otto 整理了他自己風格的html和css指南,這些建議包括屬性的順序,順序的html屬性選擇器等等。

這是乙個簡單的應用,用來來擺弄各種flexbox特性並檢視出現在頁面上的實時的完整**。它有乙個很酷的特性,你還可以通過它來編輯頁面上的文字框,允許您看到這些變化是如何影響其它內容的。

總結不管你的css水平如何,我可以保證這些東西肯定能幫到你,如果你手上有正在進行的相關專案,或是其它不錯的資源可以拿出來和大家一起分享。

Bootstrap學習 響應式實用工具

bootstrap 提供了一些幫助器類,以便更快地實現對移動裝置友好的開發。這些可以通過 查詢結合大型 小型和中型裝置,實現內容對裝置的顯示和隱藏。需要謹慎使用這些工具,避免在同乙個站點建立完全不同的版本。響應式實用工具目前只適用於塊和表切換。下表列出了列印類。使用這些切換列印內容。下面的例項演示了...

使用SQL TRACE 實用工具和TKPROF

使用sql trace 實用工具和tkprof set timing on 設定sql查詢時間 一 設定init.ora 中的timed statistices max dup file size user dump dest show parameter timed statistics time...

11個實用的CSS學習工具

通過3d轉換效果產生的互動的幻燈片。按向左或向右箭頭鍵切換,全屏 會有更好的效果。通過乙個簡單的小遊戲讓你學習css selector,輸入正確的selector來完成每一關。你也可以通過選單來選關。這是乙個簡單視覺化css選擇器。選擇左邊選單中的選擇器,選擇的條目就會出現在右邊。css 屬性有大小...