為什麼 CSS 這麼難學？

1樓：itsOli

「為什麼 CSS 這麼難學？」

其實我不知道瀏覽到這個問題的童鞋到底是想探索 CSS 是多麼的「不正交」，多麼地拍著腦袋設計出來的，多麼的麻煩……還是想看看到底有什麼好的方式去學好這個東西。

存在即合理，既然要用到它，這個方法不好學那就換個方法學：

搞定「試讀文章」，拿下市面上任意主流「靜態頁面」！

CSS 不簡單，但靜下心來該背背、該記記，細點兒心，市面上任意主流靜態頁面是不在話下的。

祝所有正在學 CSS 的童鞋一切順利！

2樓：別理

我是感興趣看看前端，不懂啥是不正交，看了之後大概了解了。但是，我覺得那個紅色方框的例子是不對的，這也只是我個人看法

我是幹 Android的，布局上也是一堆屬性，寬度有這麼幾個值：

match_parent

wrap_content

具體的寬度值

我就覺得，這兩個例子是一樣的，你沒設定不代表沒有設定，沒有寬度值，乙個view 怎麼可能會被看到呢。假設哈，如果它預設是和父布局一樣大小，你改變了 margin-left，之後的效果確實是左邊沒動。但是，其實它的寬度屬性還是和父布局一樣大小，還是 match_parent

我是從 Android 角度看的，不知道對不對 @方應杭

3樓：

應該說CSS易學難精。就單個的屬性來說，CSS都算比較簡單的，儘管有些屬性名很長。但是，當要實現某種效果時，要怎麼用你已經掌握的CSS知識來做出這樣乙個效果可能就不那麼簡單了。

通常乙個效果有多種解決方案，你還要考慮CSS怎麼合理的與HTML、JS等有機結合在一起。這時，就會感覺CSS要精通真有難度。

4樓：知還

我感覺flex布局把css的難度降低了100倍，跟客戶端的布局很像。但是一旦遇到不支援flex的情況，就非常痛苦了。我覺得應該是早期css的發明者的設計有很大缺陷吧，就像客戶端，也是不停地在推出更方便的布局方式，但前端的問題是，很多場景你都必須考慮相容性，而安卓iOS卻可以放心大膽地用新的布局方式，因為有service pack的保證，確保了向下相容。

5樓：李先生

這就是你除錯CSS時的樣子。

css的干擾太多了，誇張的說有時會牽一髮而動全身。

css就是得多寫，直說就是經驗，經驗多了，啥事經驗，就是寫的多了，遇到的問題就多了，寫的時候就會規避掉很多問題，比如以前我會這樣寫

html：

css:

div p

直接給樣式div 下面的p寫樣式，但是現在不會這麼寫了，都是老老實實的加class，因為鬼知道這個div裡面以後會不會有改動。

還有時也懶得調css，比如寫個彈窗，彈窗要居中，那我就直接給彈窗絕對定位，然後JS寫彈窗的

left = （螢幕寬度 - 彈窗寬度）/ 2，這樣永遠不會出相容性問題。

6樓：

CSS真的把我給整吐了，感覺沒一點兒邏輯，知道自己寫下每個標籤每條規則的作用

嘿，但是你只要改動一點全亂了

**我又來了**

為啥我又來了，因為我學習到了乙個新的表達情緒的方法。

為啥我又來了，因為我學習到了乙個新的表達情緒的方法#&^&!2@￥&~&^&!2@￥&~&^&!

2@￥&~&^&!2@￥&~&^&!2@￥&~&^&!

2@￥&~

寫CSS是個啥感覺，就是我在家裡畫畫，鉛筆點最後一筆，我家廁所就塌了。我真是&^&!2@￥&~&^&!

2@￥&~&^&!2@￥&~&^&!2@￥&~&^&!

2@￥&~&^&!2@￥&~

這就是傳說中的蝴蝶效應嗎？愛了愛了

7樓：亂打

只有搞前端設計的才需要深入學習css，如果你只是前端開發css沒必要學太深，如果你學習css都吃力最好別做前端，交給那些能吃苦的去幹，咱們去做後端開發，後端專注於運算的精準、執行的效率，這些東西可以積累，不會像前端痛苦的相容。

8樓：傲世盛唐

我是偏文科的，所以我總覺得html和css更好學，個人不太喜歡js那些程式語言的演算法邏輯的，畢竟數學一點都不好，相反倒覺得html和css好學許多了，感覺比較死

9樓：囧妹妹

我把CSS看成Photoshop中圖層的種種樣式。

CSS確實有很多繁雜的屬性，但這不理解我使用它。就像我不需要理解Photoshop裡面圖層樣式的每乙個屬性。我只需要利用其中若干個屬性就可以達到我喜歡的效果，對應到CSS的編寫上，也就是寫幾個屬性樣式而已。

CSS確實不應當用「程式語言」的思維去看待它，因為從根本上來說，CSS沒有什麼邏輯處理和傳值傳參的功能，拿程式語言的思維去學很容易一臉茫然。現在有很多的CSS預編譯器為那些擅長偏後端的開發者提供了「用程式語言去思考CSS」的可能。但是最終你還是得為了CSS中一條條「奇怪」的屬性的作用而陷入僵局。

布局是CSS基本功，也是學習時候的重難點，就像C語言中的指標一樣重要。遇到困難的地方只能靜心研究一番。對於題主給出的「覺得CSS難的原因」，我用我對CSS的拙劣理解給你提點建議：

debug絕對不是造成CSS困難的原因，nodejs的實時編譯其實讓寫CSS變成很輕鬆愉快的事情。正所謂所寫即所得，我每寫幾行CSS就儲存一下，瀏覽器就會呈現效果。呈現的不是我想要的效果那就說明我寫的有問題再改改。

我認為像這樣就能在開發階段就能解決掉一大部分CSS的樣式問題。

至於覺得CSS雜細多，可能是你經常看著文件學習CSS的原因吧。實際上我的學習思路就是「等到自己想要什麼，就去查一下有沒有對應的功能」。我就經常喜歡用Photoshop與CSS相提並論，覺得CSS就是瀏覽器的Ps。

大部分想要實現的功能查一下都有，在開發中學習我覺得是相對輕鬆的學習CSS的方法。

10樓：心臟跳動

我覺得CSS較難掌握好有幾個原因：

CSS中盒子模型沒有學習好，不容易理解透徹；

各種瀏覽器版本相容問題多；

層疊樣式表的設計方式本身就不好，帶來了複雜性和冗雜，不易分析，所以後面才有less, sass等拓展。

11樓：學致程式設計

css很簡單，沒有js那種複雜的演算法邏輯結構等等api，純粹只需要擔心頁面裝修，其實大多數人覺得難學，主要就是頁面寫得不夠多，大量的練習，才能總結出經驗，寫頁面才會得心應手。

12樓：

個人覺得和js、py比起來，css只說基本的布局部分(不涉及css3的彈性布局那些玩意)就是看半天書，把盒模型、浮動、定位搞懂就會了的東西。

你沒怎麼切過圖，不明白整個靜態頁面的基本流程，不天天拿css做事，你就覺得難學，就像js、py我不靠程式設計吃飯，業餘學學也覺得非常難學，永遠只會寫點下拉列表。

ie6，其實不用管了，使用者太少，少了ie6的相容技巧，實際上學習曲線陡然下降。

13樓：「已登出」

其實不難，拿個chm,把所有的CSS屬性全部記住，也沒多少，就那麼點，然後把一些不是很理解的乙個個試試，二三天搞定，剩下的就是熟練度和經驗的問題了。

14樓：南山東籬丶

和題主一樣，接觸過很多程式語言，就css最難學。

雖然這個元素沒出現在你期望的位置，但是它並不報錯，弄半天也不知道怎麼弄上去，不知道怎麼debug。

想問問以後前端定位會出現android studio那種可以直接拖動放置元素的設計嗎？

15樓：Rtree

如果你html不只用div+span,那CSS確實是前端最簡單的。第一次構建頁面都會有點不知所措，等你熟悉流程，然後熟悉常用的屬性後。完成乙個只要動畫效果不是很複雜頁面算是一件easy的事。

16樓：Menci

加油題主，關於前端，這還只是個開始。

CSS 整體上來看是個很亂，很雜的東西 —— 大量的選擇器偽類、大量的屬性名。但這裡非常適用 80/20 原則 —— 80% 的情況下你只需要用到 20% 的 CSS 屬性，特別是用了 UI 框架的前提下。所以雖然上手很困難，但學習起來還是比較輕鬆的。

以後慢慢的你就會發現，CSS 本身並不難，一點都不難，只要你用心去學的話。不管是照著教程學，還是現用現查式的積累，都不會很困難。日常會用到的，無非就是選擇器的組合、定位（static/relative/absolute/fixed/sticky）、布局（block/flex）、尺寸（width/height/margin/padding）、樣式（color/font/transition/border）這幾大塊，加上一些零碎的東西（var/calc/偽元素/各種單位）……

真正難的東西在哪呢？

難在你的網頁要怎麼設計。

就那我自己來說，當我拿筆畫出乙個原型圖的時候，我會很自然地想到 CSS 應該怎麼寫，但如果我想不到我要做的網頁長什麼樣子，我肯定也就寫不出 CSS。

所以就算是把 CSS 基本上都學會了，從零開始寫乙個頁面，還是會不知道從哪兒下手 ……

17樓：銀魂飛雪

說真的，沒感覺css難學。不過身邊確實有不少同事抱怨css複雜。

個人分析，難學的原因有幾點

css屬性很多，特別是有些歷史遺留和相容性帶來的，例如：boxsize 。導致了記憶上的難度。

乙個基本的顯示屬性互相影響，例如寬度，和border, padding,box-size, width, flex-grow, flex-shrink, left right…,。導致了邏輯上的難度css選擇器侵入特性，牽一髮而動全身，引起規劃上的難度。

我想，提問者更想問的是怎麼解決這些問題。

個人提一點思路供參考

把乙個元素在二維空間（初中平面幾何）的基本屬性理清楚：例如寬，高，水平座標，豎直座標

針對每一種布局，如何把元素定位到你想要的位置？方法可能有多種，但只需要確認一種即可，認準它，不一定非要記4種回的寫法。要到達，給一張設計圖，你就知道用哪個布局，在此布局下，如何把元素放到你要的位置

如果有條件，可以自己嘗試用js實現各種布局，因為每種布局的最終目的都是為了修改二維空間的基本屬性。自己實現一次，就能體會到設計者為什麼要設計這些屬性

4. 專案中把css選擇器的通用性規劃好，除非確定，否則不要放到全域性通用。另外，把cssmodule用起來、每個頁面最外層加上和檔名一樣的類名等等洗，限制css亂竄。

為什麼 CSS 這麼難學？

為什麼英語這麼難學？

為什麼游泳這麼難學？

為什麼模電這麼難學？

其他用戶還看了：