Ⅰ. 插件描述
Bootstrap 4 markup snippets for Vim
Ⅱ. 基本信息
| 创建日期： 2016-05-16 |
| 使用用户： 22 |
| Github星： 44 |
| 插件作者： Vanja Jelic |
|
|
|
Ⅲ. 安装方法
使用Vundle管理器安装
在你的.vimrc下添加:
Plugin 'jvanja/vim-bootstrap4-snippets'
… 然后在Vim中运行以下命令:
:source %
:PluginInstall
对于Vundle版本 < 0.10.2，请用上面的Bundle替换Plugin。
使用NeoBundle管理器安装
在你的.vimrc下添加:
NeoBundle 'jvanja/vim-bootstrap4-snippets'
… 然后在Vim中运行以下命令:
:source %
:NeoBundleInstall
使用VimPlug管理器安装
在你的.vimrc下添加:
Plug 'jvanja/vim-bootstrap4-snippets'
… 然后在Vim中运行以下命令:
:source %
:PlugInstall
使用Pathogen管理器安装
在终端中运行以下命令:
cd ~/.vim/bundle
git clone https://github.com/jvanja/vim-bootstrap4-snippets
Ⅳ. 文档说明
# Bootstrap 4 Snippets
HTML snippets for Twitter Bootstrap 4 markup, for the Vim UltiSnips and snipMate.
Installation
# add this line to your .vimrc
$ Plugin 'jvanja/vim-bootstrap4-snippets'
$ cd ~/.vim
$ mkdir bundle
$ cd bundle
# Install vim-bootstrap4-snippets
$ git clone git://github.com/jvanja/vim-bootstrap4-snippets.git
Usage
In an html file, type a trigger name in Insert mode, and press your snippet trigger key to expand it into HTML markup.
btn
which generates:
<button type="button" class="btn btn-primary"></button>
See Trigger Glossary below for a full list of triggers.
Menu
Templates
Layout
Content
Components
| Snippets | Descriptions |
|---|
| cdnb4 | Generates a CSS & JS from CDN |
| htmlb4 | Generates a Basic HTML Template |
| htmlbl | Generates a Blog Template |
| htmlca | Generates a Carousel Template |
| htmlco | Generates a Cover Template |
| htmlda | Generates a Dashboard Template |
| htmlgd | Generates a Grids Template |
| htmljb | Generates a Jumbotron Template |
| htmlnb | Generates a Navbar Template |
| htmlnbfx | Generates a Fixed Navbar Template |
| htmlnbj | Generates a Justified nav Template |
| htmlnbst | Generates a Static top Navbar Templat |
| htmlsf | Generates a Sticky footer Template |
| htmlsfn | Generates a Sticky footer w/ navbar T |
| htmlsi | Generates a Sign-in Template |
| htmlst | Generates a Starter Template |
Layout
| Snippets | Descriptions |
|---|
| con | Generates a container |
| conf | Generates a fluid container |
| row | Generates a row |
| grid | Generates a grid |
| col | Generates a column |
| col-xs | Generates a extra small column |
| col-sm | Generates a small column |
| col-md | Generates a medium column |
| col-lg | Generates a large column |
| col-xl | Generates a extra large column |
| colcf | Generates a Clearfix for Grid system |
| 3col | Generates a 3 Columns Grid |
| 2col | Generates a 2 Columns Grid |
| 4col | Generates a 4 Columns Grid |
| 6col | Generates a 6 Columns Grid |
| 12col | Generates a 12 Columns Grid |
| 2colr | Generates a Responsive 3 Columns Grid |
| 3colr | Generates a Responsive 2 Columns Grid |
| 4colr | Generates a Responsive 4 Columns Grid |
| 6colr | Generates a Responsive 6 Columns Grid |
| 12colr | Generates a Responsive 12 Columns Gri |
| Snippets | Descriptions |
|---|
| med | Generates a Media |
| medr | Generates a Media right |
| medm | Generates a Media middle |
| medb | Generates a Media bottom |
| medl | Generates a Media List |
| Snippets | Descriptions |
|---|
| colh | Generates a Responsive hidden classes |
| colvp | Generates a Responsive visible print |
| colhp | Generates a Responsive hidden print c |
Content
| Snippets | Descriptions |
|---|
| texm | Generates a Text Muted |
| dih | Generates a Display Heading |
| lead | Generates a Lead |
| blo | Generates a Blockquotes |
| blor | Generates a Blockquotes Reverse |
| lisun | Generates a List Unstyled |
| lisin | Generates a List Inline |
| desho | Generates a Horizontal Description |
| imgr | Generates a Responsive Image - |
| imgro | Generates an Image Rounded - |
| imgci | Generates an Image Circle - |
| imgth | Generates an Image Thumbnail - |
| imgl | Generates an Image Left - |
| imgr | Generates an Image Right - |
| imgce | Generates an Image Center - |
| Snippets | Descriptions |
|---|
| tab | Generates a Table |
| tabs | Generates a Tables (full option) |
| tabhin | Generates a Tables Head Inverse |
| tabr | Generates a Tables Responsive |
| tdcs | Generates a Tables Colspan |
| tabtrc | Generates a Tables Colors (tr) |
| tabtdc | Generates a Tables Colors (td) |
| Snippets | Descriptions |
|---|
| figooo | Figure |
Components
| Snippets | Descriptions |
|---|
| btn | Generates a Button |
| btnc | Generates a Button colors |
| btno | Generates a Button Outline |
| btna | Generates a Button < a > |
| btni | Generates a Button < input > |
| btnsz | Generates a Button sizes |
| btnbk | Generates a Button block |
| btnast | Generates a Button state < a> |
| btnst | Generates a Button state |
| btnt | Generates a Button toggle |
| btnpr | Generates a Button plugin Radio |
| Snippets | Descriptions |
|---|
| btngr | Generates a Button group |
| btntlb | Generates a Button toolbar |
| btngrsi | Generates a Button group size |
| btndr | Generates a Button dropdown |
| btngrvr | Generates a Button group |
| Snippets | Descriptions |
|---|
| btndd | Generates a Button dropdown |
| btndu | Generates a Button dropup |
| Snippets | Descriptions |
|---|
| form | Generates a Form Controls |
| formgr | Generates a Form group |
| formin | Generates a Form inline |
| formhl | Generates a Form hidden label |
| formgrid | Generates a Form w/ Grid |
| formcb | Generates a Form Checkbox |
| formcbin | Generates a Form Checkbox inline |
| formra | Generates a Form Radio |
| formrain | Generates a Form Radio inline |
| formrawola | Generates a Form Radio w/o label |
| formsc | Generates a Form Static Controls |
| formdis | Generates a Form disabled state |
| formreo | Generates a Form Readonly |
| formiptsz | Generates a Form input sizing |
| formsltsz | Generates a Form select sizing |
| formcolsz | Generates a Form column sizing |
| formht | Generates a Form Help text |
| formval | Generates a Form Validation |
| formctmcb | Generates a Form Custom checkbox |
| formctmra | Generates a Form Custom radio |
| Snippets | Descriptions |
|---|
| iptg | Generates an Input Group |
| iptgsz | Generates an Input Group Sizing |
| iptbtnadd | Generates a Buttons addons |
| iptbtnwdd | Generates a Buttons w/ dropdowns |
| iptbtnseg | Generates a Segmented buttons |
| Snippets | Descriptions |
|---|
| drp | Generates a Dropdown |
| drpagm | Generates a Dropdown Alignement |
| drpmh | Generates a Dropdown menu header |
| Snippets | Descriptions |
|---|
| jum | Generates a Jumbotron |
| jumf | Generates a Fluid Jumbotron |
| Snippets | Descriptions |
|---|
| lab | Generates a Label |
| labco | Generates a Label context |
| labpi | Generates a Label pill |
| Snippets | Descriptions |
|---|
| alesu | Generates an Alert success |
| alein | Generates an Alert info |
| alewa | Generates an Alert warning |
| aleda | Generates an Alert danger |
| aledis | Generates an Alert dismissing |
| Snippets | Descriptions |
|---|
| car | Generates a Cards |
| carct | Generates a Cards content type |
| carsz | Generates a Cards sizing |
| carta | Generates a Cards Text alignment |
| caric | Generates a Cards image caps |
| cario | Generates a Cards image overlays |
| carit | Generates a Cards inverted text |
| cargr | Generates a Cards groups |
| cardk | Generates a Cards decks |
| carcol | Generates a Cards columns |
| cargr | Generates a Cards groups |
| cargr | Generates a Cards groups |
| Snippets | Descriptions |
|---|
| nav | Generates a Nav |
| navin | Generates a Nav inline |
| navtb | Generates a Nav tabs |
| navpl | Generates a Nav pills |
| navplsk | Generates a Nav pills stacked |
| navtbdd | Generates a Nav tabs w/ dropdown |
| Snippets | Descriptions |
|---|
| nvb | Generates a Navbar |
| nvbc | Generates a Navbar color |
| nvbconout | Generates a Navbar container out |
| nvbconin | Generates a Navbar container in |
| nvbft | Generates a Navbar fixed top |
| nvbfb | Generates a Navbar fixed bottom |
| nvbclp | Generates a Navbar collapse |
| nvbtg | Generates a Navbar toggler |
| nvb | Generates a Navbar |
| Snippets | Descriptions |
|---|
| bre | Generates a Breadcrumb |
| Snippets | Descriptions |
|---|
| pag | Generates a Pagination |
| pagsz | Generates a Pagination |
| pager | Generates a Pagination pager |
| Snippets | Descriptions |
|---|
| pro | Generates a Progress |
| proco | Generates a Progress context |
| procost | Generates a Progress striped |
| prostan | Generates a Progress |
| Snippets | Descriptions |
|---|
| lis | Generates a List |
| lisla | Generates a List label |
| lisli | Generates a List linked |
| lisbtn | Generates a List button |
| lisdis | Generates a List disabled items |
| lisco | Generates a List context |
| liscc | Generates a List custom content |
| Snippets | Descriptions |
|---|
| mod | Generates a Modal |
| modsz | Generates a Modal sizes |
| modgr | Generates a Modal grid |
| modcb | Generates a Modal content based |
| Snippets | Descriptions |
|---|
| scr | Generates a Scrollspy |
| Snippets | Descriptions |
|---|
| too | Generates a Tooltipc |
| Snippets | Descriptions |
|---|
| pop | Generates a Popover |
| popdi | Generates a Popover direction |
| Snippets | Descriptions |
|---|
| coll | Generates a Collapse |
| colla | Generates a Collapse accordion |
| Snippets | Descriptions |
|---|
| caro | Generates a Carousel |
| caroca | Generates a Carousel caption |
| Snippets | Descriptions |
|---|
| texta | Generates a Text alignment |
| textt | Generates a Text transform |
| textcol | Generates a Text context colors |
| cloi | Generates a Close icon |
| cenb | Generates a Center block |
| cle | Generates a Clearfix |
| hid | Generates a Hidden content |
| inv | Generates an Invisible content |
| sro | Generates a Screen reader |
| imgre | Generates an Image replacement |
| emb | Generates a Responsive embeds |
Credits
These snippets are Vim rewrite of the Atom Bootstrap 4 plugin.
Bugs
Bootstrap 4 at the time this was created is still in alpha ( v4.0.0-alpha.2 ) so there could be
some breaking changes. Feel free to contribute.
Back to Top