Ⅰ. 插件描述

[deprecated] Write CSS in VIM faster.

Ⅱ. 基本信息

创建日期:  2012-01-24
使用用户:  23
Github星:  31
插件作者:  Rico Sta. Cruz

Ⅲ. 安装方法


Plugin 'rstacruz/vim-ultisnips-css'
… 然后在Vim中运行以下命令:
:source %

对于Vundle版本 < 0.10.2,请用上面的Bundle替换Plugin。


NeoBundle 'rstacruz/vim-ultisnips-css'
… 然后在Vim中运行以下命令:
:source %


Plug 'rstacruz/vim-ultisnips-css'
… 然后在Vim中运行以下命令:
:source %


cd ~/.vim/bundle
git clone

Ⅳ. 文档说明

# CSS snippets for UltiSnips.vim
Style faster.

DEPRECATED: [vim-hyperstyle] is a new and better implementation of this idea.

My collection of CSS snippets lets you type CSS faster. Just use these on a
Vim+UltiSnips setup and you can type abbreviations of declarations to expand
to full CSS like so:


To become:

display: block;
margin: 0;
float: left;
left: 5px;


Add to your .vimrc:

Bundle 'SirVer/ultisnips'
Bundle 'rstacruz/vim-ultisnips-css'


Below is a list of available snippets. For those with #, you can replace it with a number.
For instance, l# can be l0 (left: 0), or l10 (left: 10), etc

<!-- reference start (don't edit this!) -->

@nondesktop@media (max-width: 1200px) /* phone, tablet, laptop */
@portrait@media (max-width: 480px) /* portrait */
@phone@media (max-width: 768px) /* phone */
@mobile@media (max-width: 992px) /* mobile */
@desktop@media (min-width: 1201px) /* desktop */
@tablet@media (min-width: 769px) /* tablet, desktop */
@laptop@media (min-width: 993px) /* laptop */
ananimation: {name 300ms linear infinite}
bgafbackground-attachment: fixed;
bgalbackground-attachment: local;
bgasbackground-attachment: scroll;
bga`background-attachment: {scrollfixedlocal}`
bgcbbackground-clip: border-box;
bgccbackground-clip: content-box;
bgcpbackground-clip: padding-box;
bgclip`background-clip: {border-boxpadding-boxcontent-box};`
bgcbackground-color: {transparent}
bgibackground-image: {url()}
bposbackground-position: {x y}
bgpbackground-position: {x y}
bpbackground-position: {x y}
brnbackground-repeat: no-repeat;
bgrnbackground-repeat: no-repeat;
bgrxbackground-repeat: repeat-x;
brxbackground-repeat: repeat-x;
brybackground-repeat: repeat-y;
bgrybackground-repeat: repeat-y;
bgrbackground-repeat: {no-repeat}
bgsabackground-size: auto;
bgstbackground-size: contain;
bgscbackground-size: cover;
bgcoverbackground-size: cover;
bgsbackground-size: {auto}
bgbackground: {#fff url(image.png) no-repeat left top fixed}
bbrborder-bottom-left-radius: {!3px}; border-bottom-right-radius: {!3px};
bblrborder-bottom-left-radius: {3px}
bbrrborder-bottom-right-radius: {3px}
bb#border-bottom: {#};
bbborder-bottom: {solid 1px #333}
bccborder-collapse: collapse;
bl#border-left: {#};
blborder-left: {solid 1px #333}
brad#border-radius: {#};
bradborder-radius: {3}
br#border-right: {#};
brborder-right: {solid 1px #333}
blrborder-top-left-radius: {!3px}; border-bottom-left-radius: {!3px};
btrborder-top-left-radius: {!3px}; border-top-right-radius: {!3px};
btlrborder-top-left-radius: {3px}
brrborder-top-right-radius: {!3px}; border-bottom-right-radius: {!3px};
btrrborder-top-right-radius: {3px}
bt#border-top: {#};
btborder-top: {solid 1px #333}
b#bottom: {#};
bbottom: {0}
bsbox-shadow: {x y blur spead color}
bsbbox-sizing: border-box;
bspbox-sizing: padding-box;
cbclear: both;
clclear: left;
crclear: right;
cocolor: {#333}
cudcursor: default;
cdcursor: default;
cuewcursor: ew-resize;
cunacursor: not-allowed;
cunscursor: ns-resize;
cupcursor: pointer;
cpcursor: pointer;
ctcursor: text;
cutcursor: text;
cu`cursor: {defaultpointertext}`
dbdisplay: block;
dibdisplay: inline-block;
didisplay: inline;
dndisplay: none;
dtcdisplay: table-cell;
dtrdisplay: table-row;
dtdisplay: table;
d`display: {noneinlineblock}`
flfloat: left;
frfloat: right;
fffont-family: {sans-serif}
fsfont-size: {1em}
fifont-style: italic;
italicfont-style: italic;
fsifont-style: italic;
fsnfont-style: normal;
fw1font-weight: 100;
f1font-weight: 100;
f3font-weight: 300;
fw3font-weight: 300;
fw4font-weight: 400;
f4font-weight: 400;
fw5font-weight: 500;
f5font-weight: 500;
f7font-weight: 700;
fw7font-weight: 700;
fw9font-weight: 900;
f9font-weight: 900;
boldfont-weight: bold;
fbfont-weight: bold;
fwbfont-weight: bold;
fwnfont-weight: normal;
fnfont-weight: normal;
fontfont: {italic bold 1em/1.5em serif}
ffont: {italic bold 1em/1.5em serif}
h100height: 100%;
h#height: {#};
hlhheight: {0px}; line-height: {1.5};
hheight: {0}
l#left: {#};
lleft: {0}
lbleft: {0}; bottom: {0};
ltleft: {0}; top: {0};
lsletter-spacing: {0}
lhline-height: {1.5}
mb#margin-bottom: {#};
mbmargin-bottom: {0}
ml#margin-left: {#};
mlmargin-left: {0}
mr#margin-right: {#};
mrmargin-right: {0}
mt#margin-top: {#};
mtmargin-top: {0}
m0amargin: 0 auto;
moamargin: 0 auto;
m0p0margin: 0; padding: 0;
mopomargin: 0; padding: 0;
m#margin: {#};
mmargin: {0}
mahmax-height: {none}
mawmax-width: {none}
mhmin-height: {100%}
mwmin-width: {100%}
opopacity: {0}
oxaoverflow-x: auto;
oxhoverflow-x: hidden;
oxsoverflow-x: scroll;
oyaoverflow-y: auto;
oyhoverflow-y: hidden;
oysoverflow-y: scroll;
oaoverflow: auto;
ohoverflow: hidden;
osoverflow: scroll;
o`overflow: {hiddenautoscroll}`
pb#padding-bottom: {#};
pbpadding-bottom: {0}
pl#padding-left: {#};
plpadding-left: {0}
pr#padding-right: {#};
prpadding-right: {0}
pt#padding-top: {#};
ptpadding-top: {0}
p#padding: {#};
ppadding: {0}
poaposition: absolute;
pofposition: fixed;
porposition: relative;
posposition: static;
rbrgba(black, {0.2})
rwrgba(white, {0.2})
rargba({0, 0, 0}, {0.5})
r#right: {#};
rright: {0}
rbright: {0}; bottom: {0};
rtright: {0}; top: {0};
tlatable-layout: auto;
tlftable-layout: fixed;
tl`table-layout: {fixedauto}`
tactext-align: center;
tajtext-align: justify;
taltext-align: left;
tartext-align: right;
ta`text-align: {leftrightcenterjustify}`
tdlttext-decoration: line-through;
tdntext-decoration: none;
tdutext-decoration: underline;
td`text-decoration: {noneunderlinestrikethrough}`
titext-indent: {0}
tstext-shadow: {0 1px 0 #333}
ttctext-transform: capitalize;
ttltext-transform: lowercase;
ttutext-transform: uppercase;
tt`text-transform: {capitalizeuppercaselowercase}`
t#top: {#};
ttop: {0}
tftransform: {scale(1.0)}
tsttransition: {all 300ms ease}
usauser-select: all;
usnuser-select: none;
ustuser-select: text;
us`user-select: {nonetexttoggleelementelementsall}`
vablvertical-align: baseline;
vabvertical-align: bottom;
vamvertical-align: middle;
vatvertical-align: top;
va`vertical-align: {topbottombaselinemiddle}`
vcvisibility: collapse;
vhvisibility: hidden;
vvvisibility: visible;
v`visibility: {visiblehiddencollapse}`
w100width: 100%;
wawidth: auto;
w#width: {#};
wwidth: {0}
whwidth: {0}; height: {0};
ziz-index: {1}

<!-- reference end -->


Just edit the YML file, don't edit the snippet files themselves.


© 2012, Rico Sta. Cruz. Released under the MIT License.