版權聲明

所有的部落格文章都可以在右邊[blog文章原始檔案]下載最原始的文字檔案,並依你高興使用 docutil 工具轉換成任何對應的格式方便離線閱覽,除了集結成書販賣歡迎任意取用,引用

Zen Coding in Textmate

Zen Coding

Textmate 寫網頁已經夠快速了,但是編輯 html 內容還是很麻煩,難道我們不能使用類似 css selector 的語法來縮短編輯 html 的時間嗎?

比如輸入:

div.input

可以自動處理成:

<div class="input"></div>

Zen Coding 來了,讓我們寫 html 更快更方便~

看一下網頁中的影片就知道到底搞什麼了,這東西有支援很多不同的 Editor ... 不過居然漏掉編輯器之神 VIM ,作者有說有機會 port 到 vim+python 因為 他在 textmate 上面也是用 python 開發的。

語法

  • E

    Element name (如 div, p)

  • E#id

  • E.class

  • E>N

    Element Child (div>p)

  • E+N

    Slibling element

  • E*N

    多重複製

  • E$*N

    多重複製 $ 會自動取代成遞增數字:

    div.result$*3
    <div class="result1"></div>
    <div class="result2"></div>
    <div class="result3"></div>
    

Textmate 就支援上述的類 CSS Selector 展開,其他的部份就不介紹了請參閱原始連結

沒有留言:

Related Posts with Thumbnails