Web真相：CSS不是真正的編程

每隔幾個月就會出現一篇文章表明：CSS並不是真正的編程語言。以編程語言的標準來說，CSS過於困難。使用這門語言會很有創造性：

人們對CSS有一些強烈的情愫。

— Dave Rupert (@davatron5000) [September 18, 2017]

事實確實如此，CSS不同於傳統的編程，且具有缺陷，同任何標準化編程語言相比，使用起來都更為困難。這是由於CSS被設計為一種描繪界面的方式，而不是以編程形式實現該界面，例如Canvas的API。CSS的設計初衷就不同於傳統編程語言。

CSS為用戶上網時遇到的一些複雜且未知的東西創建界面，這個設計初衷是很棒的。我在2017年的GOTO Amsterdam大會上詳細講述了CSS和JavaScript的區別（CSS vs. JavaScript: Trust vs. Control）

作為一名CSS開發者，你相信用戶代理（大部分情況下指的是瀏覽器）會表現正確的行為。你無法控制CSS發生的時機，但同時你也無需擔心性能、渲染時間和響應的具體細節，因為這些細節是由瀏覽器開發者和瀏覽器所處操作系統決定的。不過很棒的一點是，CSS允許你在其應用的地方修改這些重要的細節。如果你使用JavaScript來創建界面或動畫，你不僅需要做更多深入細緻的控制，還要確保一切都能正常工作，否則可能會阻塞頁面的正常顯示。使用CSS就意味著放棄控制，而去花更多的時間創建友好的響應式交互界面。用戶可能會搞亂你的界面設置，但CSS可以為你規避這種情況。

使用CSS開發不同於傳統模式，並不需要循環、條件和變數。但CSS正朝著這個方向發展，Sass作為CSS的擴展語言，引入了變數，為CSS未來的發展奠定了基礎。但CSS最需要的不是語法糖，而是你要清楚使用CSS所描繪的界面是什麼。其次，如何確保你使用CSS編寫的界面是足夠靈活的，以至於用戶無法觸發頁面的錯誤也不會無法訪問頁面。當你理解了HTML並使用CSS來控制它的樣式時，你能夠減少很大的代碼量。

你的用戶們的忠誠度依賴於所在的技術平台，如果你不打算創建友好的交互來提升用戶體驗，增加用戶的留存度，CSS可能並不適合你。CSS被設計為一種「寬容「的語言，當你的一些代碼無法起作用時，CSS也不會報錯。因此，漸進增強是很棒的設計。你無需擔心因添加了一行不支持的代碼而出錯，解析器會跳過它不支持的屬性。當遇到錯誤時，JS解析器會中斷解析並且拋出錯誤信息，而CSS解析器會忽略這些錯誤並繼續解析。這對於想要知道錯誤信息的開發者來說會很奇怪，但是卻讓你從需要使用if來包含各種情況、兼容所有可能使用的瀏覽器這一狀況下解脫出來。如何對按鈕使用漸變效果？首先，定義一個背景色，然後在下一行設置背景為漸變。如果瀏覽器不支持漸變效果，它依舊會渲染出一個正常的按鈕，只不過背景不是漸變而已。在這個過程中，你根本無須擔心瀏覽器是否支持漸變。

由於對CSS的設計目的不了解而產生了錯誤認知，才導致出現了很多「CSS不是真正的編程」的觀點。如果你想要完全控制一切，比如界面、甚至精細到像素的話，請不要使用CSS。相反，如果你想要構建一個包羅廣泛、多種多樣的頁面，CSS是個很好的工具。編寫CSS需要站在用戶的角度考慮，設計擁有良好交互的頁面，提升用戶體驗，但這並不是說你把一個Photoshop生成的圖片放到頁面就好了。使用CSS構建頁面需要不同於後端語言的技術棧，其次，作為維護者、編寫者的心態也要發生轉變。

不管怎麼說，輕視CSS開發者、將他們視為非純正開發者，這種傲慢的想法略顯荒謬。尤其是在你甚至都沒花時間了解CSS的設計目的是什麼，以及它目前驚人的發展速度。

從另一方面來說，CSS本不是也不應該是任何問題的解決方式。例如，你可以創建帶有陰影的像素，但同時也會對瀏覽器渲染引擎帶來渲染壓力。

對我來說，CSS就是Web的一部分；對有些人來說，CSS的語法顯得很奇怪，以至於讓他們覺得是另一種編程語言。不過這些年來，隨著CSS的發展，它的價值毋庸置疑。在未來很長一段時間，CSS應該也不會消失。因此，如果你不喜歡使用CSS，那就和會使用的人合作開發網頁。如果你的上司要求你使用CSS，儘管我們沒有技術文章或刊物，但是我們有相關的項目和CSS開發者能幫助你。

與其討論「CSS是否有缺陷，需要被替代」的問題，不如以一種積極健康且不同於以往的角度討論CSS：

CSS可以做什麼，它有什麼不足

有哪些過去需要其他技術才能實現的，而現在CSS就可以做到的事情，以及如何應用

如何編寫可維護的CSS

你能夠做什麼，來使CSS開發者的開發過程更簡單、容易？

我們使用哪些CSS hack，為什麼不應該再用它們

我們可以做什麼來讓CSS這門語言變得更好、更豐富？

喜歡這篇文章嗎？立刻分享出去讓更多人知道吧！

本站內容充實豐富，博大精深，小編精選每日熱門資訊，隨時更新，點擊「搶先收到最新資訊」瀏覽吧！

請您繼續閱讀更多來自 京程一燈 的精彩文章: