Twitter的引导和比标准的图标更大的按钮

<button type="submit" class="btn btn-primary"> 
    <i class="icon-user icon-white"></i> text 
</button>

我想我自己的图标。这就是为什么我用：

<button type="submit" class="btn btn-primary"> 
    <i class="icon-school icon-white"></i> text 
</button>

我的图标显示在按钮中，但我的图标有点高（20px x 16px）。所以它显示为75％。如何解决它？更改高度或填充不起作用。

谢谢。

对于简单的生活，可能会调整您的图标大小与默认引导程序图标相同？ –

不能这样做，这不是我的力量:) – Haradzieniec

只为大家：我没有找到一个好的解决方案。当文字变得不垂直居中时，改变高度并没有太大的帮助。使用填充，背景位置并不完美。图像的大小减少了，以保持Twitter的Boostrapped。 – Haradzieniec

创建icon-perso类

<button type="submit" class="btn btn-primary"> 
    <i class="icon-school icon-perso"></i> text 
</button>

添加以下CSS来超越默认行为：

。

.icon-perso { 
    background-image: url("../img/glyphicons-perso.png"); 
    width: 20px; 
    height: 16px 
    line-height: 16px; 
}

如果图片包含多个图标，如glyphicons-halflings.png您可能需要更改背景位置

.icon-school { 
    background-position: 0px 0px; 
}

您可以在bootstrap.css周围一看，从线2143，如果你是好奇。

2012-09-10 16:06:45 baptme

最好的办法是延长图标精灵的引导程序并在css中再添加一行，并确定新图标的确切位置。

搜索其中一个引导程序图标并添加以下内容。

我总是以这种方式也如果我的图标更大，只是改变你的唯一的宽度/高度。

2012-09-10 13:55:38

回答