Looking at the source of the Bootstrap page, they have done this by making the icons a font. I would suggest using this method as it is a easy and compact way to do it. You can use a font editor like this: http://icomoon.io/app/#/select
It seems to have pretty decent support for uploading SVG's to it so you can make your own font.
you can then import your font in css like:
@font-face {
font-family: 'my-vector-font';
src: url('my-vector-font.eot');
src: local('my-vector-font'),
local('my-vector-font'),
url('my-vector-font.ttf') format('truetype'),
url('my-vector-font.svg#font') format('svg');
}
...and then use it in css like:
.icon-1:before {
font-family: 'my-vector-font';
content: "{CHARACTER_FOR_ICON}";
}
You can tune up that selector with padding, etc.. as you need.