1. 程式人生 > >網頁設計:vim+emmet簡單演練

網頁設計:vim+emmet簡單演練

帳號 另存為 密碼 htm text 網頁 class use span

打開vim後,在英文狀態下,按下小寫字母 i 鍵。

輸入

html:5>h2+form>p*10

光標在行的末尾處,在英文狀態下,同時按下ctrl + y (control 鍵和y鍵),然後立即松手,等一秒鐘,再按下 , 鍵。

技術分享圖片

<h2>網絡書城演示</h2>

技術分享圖片

輸入

{帳號:}input[type=text name=userid size=16] 

技術分享圖片

光標在

{帳號:}input[type=text name=userid size=16]的末尾處,
在英文狀態下,同時按下ctrl + y (control 鍵和y鍵),然後立即松手,等一秒鐘,再按下 , 鍵。

技術分享圖片

輸入

{密碼:}input[type=password name pass size=16]

技術分享圖片

光標在

{密碼:}input[type=password name pass size=16]的末尾處,
在英文狀態下,同時按下ctrl + y (control 鍵和y鍵),然後立即松手,等一秒鐘,再按下 , 鍵。

技術分享圖片

點擊,保存窗口,將文件另存為   test.html
用瀏覽器打開的效果如下

技術分享圖片



網頁設計:vim+emmet簡單演練