摘要：作為女性，你又來(lái)自互聯(lián)網(wǎng)技術(shù)不太發(fā)達(dá)的希臘。希臘目前可能還存在一些針對(duì)女性的性別歧視，但并不明顯，不然我可能會(huì)被影響到。實(shí)際上，有時(shí)候希臘在性別平等方面比其他西方國(guó)家更進(jìn)步。

本文僅用于學(xué)習(xí)和交流，不用于商業(yè)目的。非商業(yè)轉(zhuǎn)載請(qǐng)注明作譯者、出處，并保留本文的原始鏈接：http://www.ituring.com.cn/art...

Lea Verou
W3C CSS工作組特邀專家，設(shè)計(jì)CSS語(yǔ)言的委員之一，此前曾在W3C擔(dān)任開(kāi)發(fā)者代言人。目前，她在麻省理工學(xué)院從事人機(jī)交互領(lǐng)域的研究。她還是一位博客作家，并經(jīng)常在國(guó)際性的技術(shù)會(huì)議上擔(dān)任講師；她創(chuàng)建的多個(gè)開(kāi)源項(xiàng)目廣受開(kāi)發(fā)者歡迎。

                             **-圖說(shuō)-**

來(lái)自CSS一姐的個(gè)人網(wǎng)站（http://lea.verou.me），也多用于各種公眾場(chǎng)合，例如本書(shū)的作者介紹部分。

                            **-圖說(shuō)-**
                        Lea的運(yùn)動(dòng)照，愛(ài)游泳。
     

          **-圖說(shuō)-**
 Lea自己設(shè)計(jì)的圖標(biāo)，常見(jiàn)各種公眾場(chǎng)合，包括本書(shū)的封面。

《CSS揭秘》是CSS一姐Lea Verou的最新作品，堪稱“近年來(lái)最重要的CSS技術(shù)書(shū)，挖掘了很多有用的CSS技術(shù)點(diǎn)！ ”

從實(shí)踐需要出發(fā)，Lea為我們揭示了47個(gè)鮮為人知的CSS技巧，主要內(nèi)容包括背景與邊框、形狀、視覺(jué)效果、字體排印、用戶體驗(yàn)、結(jié)構(gòu)與布局、過(guò)渡與動(dòng)畫(huà)等。本書(shū)將帶領(lǐng)讀者循序漸進(jìn)地探尋更優(yōu)雅的解決方案，攻克每天都會(huì)遇到的各種網(wǎng)頁(yè)樣式難題。

本書(shū)的讀者對(duì)象為前端工程師、網(wǎng)頁(yè)開(kāi)發(fā)人員。

作品選讀：本書(shū)贊譽(yù)

非常榮幸能夠邀請(qǐng)到暢銷書(shū)《CSS 揭秘》的作者Lea Verou，進(jìn)行一期圖靈專訪。請(qǐng)問(wèn)Lea寫(xiě)這本書(shū)的初衷是什么？讀者應(yīng)該怎樣閱讀本書(shū)？

市面上有很多CSS的書(shū)，有全面講解CSS各方面知識(shí)的，也有專注介紹某一方面的。但是，沒(méi)有一本書(shū)教會(huì)讀者怎樣運(yùn)用CSS創(chuàng)造性地思考、解決問(wèn)題，也沒(méi)有一本書(shū)可以跳過(guò)最開(kāi)始的簡(jiǎn)介部分。

概括來(lái)講，這似乎是學(xué)習(xí)新知識(shí)時(shí)的一個(gè)普遍問(wèn)題：大多數(shù)圖書(shū)只會(huì)提供陳腐、老掉牙的解決方案，卻不會(huì)嘗試向讀者介紹如何獲得自己的解決方法。說(shuō)到CSS方面的書(shū)，作者們總是想當(dāng)然地認(rèn)為讀者都是些“技術(shù)小白”，也就想當(dāng)然地架構(gòu)起內(nèi)容?！禖SS 揭秘》這本書(shū)呢，尊重語(yǔ)言和讀者，沒(méi)有簡(jiǎn)化內(nèi)容。CSS高級(jí)開(kāi)發(fā)人員以及真正理解CSS是如何工作卻想進(jìn)一步提高知識(shí)的人，會(huì)從本書(shū)中獲益最多。

《CSS揭秘》封面的右下角有一個(gè)類似海盜標(biāo)志的Logo，而這個(gè)標(biāo)志同樣也出現(xiàn)在你的個(gè)人網(wǎng)站上。這個(gè)標(biāo)志的背后含義是什么？對(duì)我自己而言，你好像挺欣賞海盜元素的，透過(guò)批判性思維能從“丑陋”當(dāng)中發(fā)現(xiàn)“美善”？

這是我個(gè)人的Logo，已經(jīng)用了好多年了。它本身并沒(méi)有什么特殊的含義，不用太認(rèn)真對(duì)待。括號(hào)（{ }）表示代碼，作為語(yǔ)法元素經(jīng)常出現(xiàn)在CSS和JavaScript里。兩把交叉刀代表海盜、編碼界的海盜。在西方文化當(dāng)中，海盜并不一定表示壞的意思，他們也可以表示某方面的“大?！薄＿@也是我想要傳達(dá)的意思。

我們一般認(rèn)為，男權(quán)社會(huì)中男性的地位要高于女性。作為女性，你又來(lái)自互聯(lián)網(wǎng)技術(shù)不太發(fā)達(dá)的希臘。是什么原因讓你成為一位世界范圍內(nèi)廣泛知曉的開(kāi)發(fā)人員？一個(gè)人的出身是否可以決定她/他的成就？

值得慶幸的是，網(wǎng)絡(luò)的普及，讓出身和人們所能達(dá)到的高度之間不存在必然聯(lián)系。我見(jiàn)過(guò)有的人把自己封閉在某個(gè)網(wǎng)絡(luò)的小角落里，只跟自己國(guó)家的人交流、工作，但這是他們的選擇。只要把英語(yǔ)說(shuō)好，沒(méi)有人能限制他們成就的廣度和深度。我希望任何想在國(guó)際舞臺(tái)上做出一些事情的人要專注于提高自己的英語(yǔ)水平，而不僅僅是他們的HTML、CSS和JavaScript。不管你的技術(shù)知識(shí)有多好，如果不能很好地表達(dá)自己，沒(méi)有人會(huì)知道。

講一個(gè)我自己的有趣故事，開(kāi)始創(chuàng)建個(gè)人博客lea.verou.me之前，我曾用希臘語(yǔ)創(chuàng)建過(guò)一個(gè)博客，很遺憾完全地、徹底地失敗了。在希臘，很少有人會(huì)對(duì)前沿的css技術(shù)感興趣，這也就可以解釋為什么希臘的開(kāi)發(fā)人員掙得那么少，還常常被他們的客戶刁難。我很慶幸自己沒(méi)有放棄，開(kāi)始創(chuàng)建用英語(yǔ)編寫(xiě)的國(guó)際博客，不然我的生活肯定是另一番樣態(tài)。

希臘目前可能還存在一些針對(duì)女性的性別歧視，但并不明顯，不然我可能會(huì)被影響到。實(shí)際上，有時(shí)候希臘在性別平等方面比其他西方國(guó)家更進(jìn)步。我最近在個(gè)人博客上寫(xiě)了一篇博文（http://lea.verou.me/2015/12/m... ），文章里講到在我的職業(yè)生涯里，我個(gè)人還沒(méi)有真正經(jīng)歷過(guò)任何的性別歧視。所以，我喜歡做這一行：）

除了寫(xiě)書(shū)分享知識(shí)以外，你還分享了好多的開(kāi)源項(xiàng)目。但是，據(jù)我所知，有些人是不愿意分享代碼示例的。他們認(rèn)可展示出來(lái)設(shè)計(jì)良好的作品，卻不愿意分享設(shè)計(jì)藍(lán)圖。你怎么看待？

代碼共享是一種回饋社會(huì)的行為。無(wú)論從事什么行業(yè)，我們都離不開(kāi)開(kāi)源項(xiàng)目的幫助。想象一下，如果每個(gè)人的邏輯都一模一樣，我們的專業(yè)會(huì)千篇一律。使用了別人分享的成果卻不愿意分享自己的代碼，在我看來(lái)，有點(diǎn)“小自私”。的確，其他行業(yè)的文化可能有所不同，從業(yè)人員不愿意分享工作。

我很喜歡技術(shù)行業(yè)的開(kāi)放分享文化，欣賞開(kāi)發(fā)人員之間分享知識(shí)、互相幫助的活動(dòng)。他們熱衷于分享代碼或者回答Stack Overflow技術(shù)問(wèn)答網(wǎng)站上的問(wèn)題。換做是我，我一樣會(huì)這么做。另外，當(dāng)我的工作可以幫助到別人、被他人使用時(shí)，我非常高興。這就是為什么我選擇這個(gè)領(lǐng)域的原因。

開(kāi)源代碼也意味著其他人可以參與進(jìn)來(lái)，為項(xiàng)目做貢獻(xiàn)，最終項(xiàng)目的質(zhì)量也更高。比如說(shuō)，我發(fā)布Bliss的時(shí)候，還沒(méi)有測(cè)試，現(xiàn)在它有一整套testsuite幫助調(diào)試bug。還有許多項(xiàng)目，比如PrismJS是由社區(qū)共同維護(hù)的。我自己沒(méi)有時(shí)間維護(hù)它們，如果不是開(kāi)源，項(xiàng)目只會(huì)爛尾。

演講時(shí)，現(xiàn)場(chǎng)展示代碼編寫(xiě)過(guò)程應(yīng)該算是開(kāi)源的最高形式。難道你沒(méi)有想過(guò)代碼漏洞或者拖延會(huì)影響公共演講嗎？通常你怎么為會(huì)議演講做準(zhǔn)備？

現(xiàn)場(chǎng)展示代碼編寫(xiě)之前，我會(huì)一遍一遍地演示代碼，這一點(diǎn)非常重要。代碼要盡可能短，盡量減少犯錯(cuò)的機(jī)會(huì)，而且一般情況下，觀眾也無(wú)法消化一張幻燈片上好多行的代碼量。我見(jiàn)過(guò)有人曾用100行的代碼啟動(dòng)IDE ，在開(kāi)始演示代碼編寫(xiě)之前，很多觀眾早已失去了興趣。

盡管你竭盡可能避免犯錯(cuò)，現(xiàn)場(chǎng)展示代碼編寫(xiě)總避免不了失誤的發(fā)生。出發(fā)前，我還在飛機(jī)上調(diào)試漏洞，除非能立即修復(fù)，不然我只能暫且放下問(wèn)題。沒(méi)有人希望在現(xiàn)場(chǎng)展示時(shí)跟代碼漏洞較勁。我個(gè)人經(jīng)歷中，只要演講者能很快調(diào)試好代碼，聽(tīng)眾大都很理解。

下面我們來(lái)聊聊CSS。和CSS相比，JavaScript的新增特性從生成到廣泛應(yīng)用歷時(shí)幾天，而CSS的新增特性要經(jīng)歷長(zhǎng)達(dá)幾年的周期。所以，有人建議多增加一些CSS polyfill。你怎么看待這個(gè)問(wèn)題？

這樣做肯定會(huì)縮短新特性的周期。按照這種思路，PostCSS 運(yùn)用CSSNext大大縮短了CSS新增特征的周期，但并不是所有的新特性都可以提前處理。對(duì)于更多的動(dòng)態(tài)特性，比如自定義屬性的新unit，目前polyfill就無(wú)法進(jìn)行填充或轉(zhuǎn)譯，但大多數(shù)的JS API卻可以很容易地被轉(zhuǎn)譯。Houdini API能夠很好地解決這個(gè)難題，讓我們像編寫(xiě)JS polyfill 一樣輕松編寫(xiě)CSS polyfills。

Houdini 是W3C的一個(gè)新增工作組，他們的最終目標(biāo)是讓瀏覽器支持CSS特性。如果真能成功的話，這無(wú)疑是CSS發(fā)展史上最令人興奮的時(shí)刻。你認(rèn)為Houdini 的目標(biāo)可行嗎？

Houdini肯定會(huì)讓CSS polyfill成為可能，這的確令人興奮，我也很期待。不過(guò)我擔(dān)心開(kāi)發(fā)人員把Houdini 當(dāng)作拐杖，不讓瀏覽器實(shí)現(xiàn)某些功能。他們認(rèn)為開(kāi)發(fā)人員通過(guò)Houdini API總能編寫(xiě)出應(yīng)對(duì)問(wèn)題的庫(kù)。我不希望CSS因?yàn)镠oudini 的工作就停止進(jìn)一步發(fā)展，我也不愿意看到CSS成為一個(gè)依賴大量庫(kù)解決基本問(wèn)題的“地獄”。

運(yùn)用JavaScript代碼編寫(xiě)HTML解決了很多問(wèn)題，所以一些React.JS開(kāi)發(fā)人員嘗試把CSS和JavaScript兩種語(yǔ)言結(jié)合起來(lái)，解決CSS存在的問(wèn)題。你怎么看待JavaScript代碼編寫(xiě)CSS的現(xiàn)象。

我認(rèn)為，這主要是那些并不真正了解CSS，只想用JS代碼解決一切問(wèn)題的JavaScript開(kāi)發(fā)人員的想法?！叭绻阒挥幸话彦N子，看什么都是釘子?！边@樣做，只能讓他們喪失掉大部分的潛在合作伙伴：有一半的HTML 和CSS 開(kāi)發(fā)人員對(duì)JS不感冒。

不過(guò)，CSS工作組的成員也認(rèn)識(shí)到CSS在范疇和封裝方面的問(wèn)題，正在積極討論解決方案。

CSS已經(jīng)從網(wǎng)頁(yè)設(shè)計(jì)延伸到了出版行業(yè)，例如O’Reilly 已經(jīng)開(kāi)始嘗試把CSS運(yùn)用到出版流程。你認(rèn)為CSS能勝任出版行業(yè)的要求么？基于出版行業(yè)的要求，W3C之后會(huì)對(duì)CSS做出相應(yīng)的規(guī)范么？

CSS從一開(kāi)始就是要設(shè)計(jì)成一門(mén)文檔樣式語(yǔ)言的，把CSS運(yùn)用到出版行業(yè)也是必然的。實(shí)際上，CSS 之父 Bert Bos和Hakon Wium Lie，在11年前也就是2005年的時(shí)候，就運(yùn)用CSS排版了《CSS：網(wǎng)頁(yè)設(shè)計(jì)》這本書(shū)（http://alistapart.com/article...）

當(dāng)然， CSS要想和現(xiàn)有工具InDesign一樣靈活，還需要很多工作要準(zhǔn)備。在過(guò)去的幾年里，我們已經(jīng)取得了很大的進(jìn)步。不過(guò)，網(wǎng)頁(yè)比出版社的資源廣，所以他們的聲音更容易被CSS工作組了解到。出版行業(yè)是一個(gè)嚴(yán)肅的行業(yè)，我們會(huì)認(rèn)真考慮添加的每一個(gè)新功能。

更多精彩，加入圖靈訪談微信！