發現一個特給力的編寫HTML/CSS的外掛程式——Zen Coding

來源:互聯網
上載者:User

  這不是一個新東西,但它確實是個好東西。只能說我OUT了,這小外掛程式還是在別人部落格上一年前的日誌裡看到的,先來個連結吧,寫的已經很詳細了,我這裡只是給自己做個記錄,留給自己看的。(Zen Coding: 一種快速編寫HTML/CSS代碼的方法)

  那Zen Coding到底是什麼,又是如何使用的呢?我們看一下官方舉的例子吧,如果你輸入:

div#page>div.logo+ul#navigation>li*5>a

  就會看到這樣的輸出:

<div id="page">         <div class="logo"></div>         <ul id="navigation">                 <li><a href=""></a></li>                 <li><a href=""></a></li>                 <li><a href=""></a></li>                 <li><a href=""></a></li>                 <li><a href=""></a></li>         </ul></div>

  有點看不懂了吧?那我們再來看個視頻,不過有點模糊。

  實際上,Zen Coding就是把長代碼用短代碼代替,而短代碼會自動產生需要的長代碼。說的有點白話,不過這樣應該能理解。

  Zen Coding支援很多ide,你可以去網站上找適合你的外掛程式。

  表達能力實在欠缺,我還是留2個連結給自己存檔吧:CSS和HTML縮寫和片段

  總的來說,Zen Coding能大大減少我們在css和html上的編碼時間,但高效的寫法還是需要一定的練習才能掌握,如果你也喜歡,不妨試一試。

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.