隨著CSS不斷創(chuàng)新發(fā)展，網(wǎng)站建設(shè)迎來了變革性的改變。新的特性、技術(shù)、實驗和想法向我們襲來，其程度是自“CSS3”以來從未見過的。當(dāng)你的職業(yè)似乎以極快的速度前進(jìn)時，很容易感到不知所措，但同樣容易為一年前還不存在的今天的可能感到興奮和鼓舞。

CSS變得比寫起來容易多了，這并不是因為一個改變一切的熱門新功能——比如層疊層或新的色彩空間——而是有多少新功能共同努力讓我的風(fēng)格更簡潔，更有彈性，甚至有點防御性。這里有一個快速點擊。而不是鏈接:hover和:focus狀態(tài)，用逗號分隔，使用較新的:is()偽類使它成為可讀性更好的一行程序:
/* Tradition */
a:hover,
a:focus {
  /* Styles */
}

/* More readable */
a:is(:hover, :focus) {
  /* Styles */
}
這是個經(jīng)典的例子吧？可以說，將元素對齊父容器中心的“傳統(tǒng)”方法通常是顯而易見的。我們伸手去拿一些不同的margin: auto從各個方向向內(nèi)推動一個元素，直到它垂直位于中間。這仍然是一個非常有效的居中解決方案，因為margin速記看各個方向。但是說我們只需要在在一條直線上的方向，如左和右，當(dāng)在默認(rèn)的水平從左到右書寫模式下工作時。這就是“傳統(tǒng)”方法有點失敗的地方。

也許“分崩離析”是重手。更多的是它需要放棄多才多藝margin速記和達(dá)到兩個特定的組成屬性，增加了一行開銷。但是，多虧了這個概念邏輯屬性，我們又多了兩個人手margin品種:一個適合街區(qū)方向和一個在一條直線上的方向。因此，回到只需要在內(nèi)聯(lián)方向進(jìn)行對中的情況，我們現(xiàn)在有了這個來保持效率:

你知道還有什么嗎？這個例子實現(xiàn)了從物理屬性到邏輯屬性的微妙轉(zhuǎn)換，這個簡單的事實意味著這個小片段和拋出一樣有效margin: auto并能適應(yīng)書寫模式的變化。如果頁面突然發(fā)現(xiàn)自己處于垂直的從右到左模式，當(dāng)行內(nèi)方向向上和向下流動而不是向左和向右流動時，它仍然通過自動使元素在行內(nèi)方向居中而保持不變。

對于CSS來說，有兩件事是非常新的，我非常喜歡:字符長度單位(ch)和text-wrap: balance.就前者而言，我喜歡它確立了容器的最大寬度，尤其是那些用來存放長格式內(nèi)容的容器。傳統(tǒng)觀點告訴我們，一行文本的理想長度是每行50-75個字符，取決于您的來源。在一個字體大小可以適應(yīng)容器大小或視口大小預(yù)測一行中有多少字符是一個移動目標(biāo)的猜謎游戲。但是如果我們通過ch在較小的上下文中，這不再是一個問題，我們可以確保在任何斷點都有一個舒適的讀取空間——沒有介質(zhì)。

標(biāo)題也是如此。我們并不總是有我們需要的信息——字體大小、容器大小、書寫模式等等——來產(chǎn)生一個平衡的標(biāo)題。但你知道誰知道嗎？瀏覽器！使用新的text-wrap: balance值允許瀏覽器決定何時以某種方式換行，以防止在多行標(biāo)題中出現(xiàn)孤立單詞或嚴(yán)重不平衡的行長度。這是我們等待完整瀏覽器支持的另一個例子(在這種情況下，Safari).盡管如此，這也是我現(xiàn)在作為一種漸進(jìn)的增強(qiáng)投入生產(chǎn)的事情之一，因為有或沒有它都不會有負(fù)面的后果。

我知道曾經(jīng)有一段時間我們中的一些人公開質(zhì)疑如今“太多”的CSS并認(rèn)為進(jìn)入CSS的學(xué)習(xí)曲線正在成為新前端進(jìn)入的一個困難的障礙。你發(fā)現(xiàn)自己在使用哪些新功能，它們是否幫助你以新的不同的方式編寫CSS，使你的代碼更容易閱讀和維護(hù)，或者“重新學(xué)習(xí)”你對樣式的看法。