在Brackets中使用Emmet

2022-01-18 20:12:07 字數 2219 閱讀 4656

當在brackets中安裝上emmet外掛程式後,就可以使用emmet的語法來加速前端編寫。

有關html

● 子關係》

div>ul>li

● 相鄰+

div+p+bq

● 上一級^

div+div>p>span+em^bq

● 重複*

ul>li*5

● 分組()

div>(header>ul>li*2)+footer>p

● 類div.demo

● id

div#demo

● 索引$

ul>li.item$*5

ul>li.item$$$*5

ul>li.item$@-*5 倒排序

ul>li.item$@3*5 從3開始

● 文字

a● 在父級元素中使用emmet的縮寫

.item

自動補全為:

以此類推,在ul,ol中補li,在table,tbody,thead,tfoot中補tr,在tr中補td,在select中補option

● 舉例文字

p*4>lorem

有關css

● -bdrs,自動補全為:

-webkit-border-radius: ;

-moz-border-radius: ;

-ms-border-radius: ;

-o-border-radius: ;

border-radius: ;

● -foo,自動補全為:

-webkit-font: ;

-moz-font: ;

-ms-font: ;

-o-font: ;

font: ;

● -super-foo,自動補全為:

-webkit-super-foo: ;

-moz-super-foo: ;

-ms-super-foo: ;

-o-super-foo: ;

super-foo: ;

● -wm-trf,自動補全為:

-webkit-transform: ;

-moz-transform: ;

transform: ;

● lg(left, #fc0 30%, red),自動補全為:

background-image: -webkit-linear-gradient(left, #fc0 30%, red);

background-image: -o-linear-gradient(left, #fc0 30%, red);

background-image: linear-gradient(to right, #fc0 30%, red);

● border-image: lg(left, #fc0 30%, red),自動補全為:

background-image: border-image: -webkit-linear-gradient(left, #fc0 30%, red);

background-image: border-image: -o-linear-gradient(left, #fc0 30%, red);

background-image: border-image: linear-gradient(to right, #fc0 30%, red);

● ovh,自動補全為:

overflow: hidden;

有關操作

● 向外選擇

ctrl+alt+b

● 向內選擇

ctrl+alt+shift+b

● 成對元素標籤之間跳轉

ctrl+shift+t

● 包裹現有元素

現有:hello world

hello world

當然也可以選擇多行元素,再進行包裹。

● 前乙個編輯節點

ctrl+alt+left

ctrl+alt+right

● 依次向後選擇元素

ctrl+shift+.

● 依次向前選擇元素

ctrl+shift+,

● 注釋取消注釋

ctrl+/

● 移除標籤

ctrl+shift+k

● 合併多行

ctrl+shift+m

● 改變量值大小

ctrl+shif+方向鍵,以10為單位

ctrl+shift+alt+方向鍵,以0.1為單位

在中使用SQLDMO

曾幾何時,夥伴們為的公升級傷透了腦筋.往往程式的公升級趕不上資料庫的公升級 版本控制的好,這也許不是什麼問題,但對於很大一部分中國公司來說這是無法避免的 而有些n久以前的資料庫要使用新程式的時候,資料庫的公升級簡直就是無從下手.所以對比資料庫公升級的緊要性就逐漸的凸現出來.對於表和字段的公升級按道理...

在ClanLib中使用blend func

本文是對blend func完全沒有認識的人寫的,就好象一天前的我一樣。廢話我就留到後面才說吧。在clanlib庫中的cl su ce與cl sprite中都會有 這個函式 void set blend func cl blendfunc src,cl blendfunc dest 其cl blen...

在MFC中使用Tab Control

說實話,我剛開始看見tab control的時候,覺得很簡單。哪知道用了一下,才發現自己錯了。要用好它,還是需要一些技巧的。經過網上搜尋資料,以及我自己的摸索,把一些要點記錄在這裡。tab control的執行效果有點像property sheet,但兩者還是有一些區別。我的理解就是property...