CSS 更大的字形
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/18478365/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Bigger Glyphicons
提问by guiomie
How do I make bigger Glyphicons in twitter bootstrap 3.0 (not 2.3.x).
如何在 twitter bootstrap 3.0（不是 2.3.x）中制作更大的 Glyphicons。
This code will make my glyphicons big:
这段代码将使我的字形变大：
<button type="button" class="btn btn-default btn-lg">
<span class="glyphicon glyphicon-th-list">
</span>
</button>
How can I get this size withoutusing the btn-lg class while using onlya span ?
我怎样才能在不使用 btn-lg 类的情况下获得这个大小，而只使用一个 span ？
This gives a small glyphicon:
这给出了一个小字形：
<span class="glyphicon glyphicon-link"></span>
回答by
You can just give the glyphicon a font-size to your liking:
您可以根据自己的喜好为字形设置字体大小：
span.glyphicon-link {
font-size: 1.2em;
}
回答by Randy Greencorn
Here's how I do it:
这是我的方法：
<span style="font-size:1.5em;" class="glyphicon glyphicon-th-list"></span>
This allows you to change size on the fly. Works best for ad hoc requirements to change the size, rather than changing the css and having it apply to all.
这允许您即时更改大小。最适合更改大小的临时要求，而不是更改 css 并将其应用于所有人。
回答by Angelique
The .btn-lgclass has the following CSS in Bootstrap 3 (link):
该.btn-lg班在引导3（以下CSS链接）：
.btn-lg {
padding: 10px 16px;
font-size: 18px;
line-height: 1.33;
border-radius: 6px;
}
If you apply the same font-sizeand line-heightto your span (either .glyphicon-linkor a newly created .glyphicons-lgif you're going to use this effect in more than one instance), you'll get a Glyphicon the same size as the large button.
如果您将相同的font-size和line-height应用于您的跨度（如果您要在多个实例中使用此效果，则为.glyphicon-link新创建的.glyphicons-lg），您将获得一个与大按钮相同大小的 Glyphicon。
回答by bar?? ??rac?
<button class="btn btn-default glyphicon glyphicon-plus fa-2x" type="button">
</button>
<!--fa-2x , fa-3x , fa-4x ... -->
<button class="btn btn-default glyphicon glyphicon-plus fa-3x" type="button">
</button>回答by quiet
Write your <span>in <h1>or <h2>:
写下你<span>的<h1>或<h2>：
<h1> <span class="glyphicon glyphicon-th-list"></span></h1>
回答by victorf
In my case, I had an input-group-btnwith a button, and this buttonwas a little bigger than its container. So I just gave font-size:95%for my glyphicon and it was solved.
就我而言，我有一个input-group-btn带 a 的button，这button比它的容器大一点。所以我只是给font-size:95%了我的字形图标，它就解决了。
<div class="input-group">
<input type="text" class="form-control" id="pesquisarinbox" placeholder="Pesquisar na Caixa de Entrada">
<div class="input-group-btn">
<button class="btn btn-default" type="button">
<span class="glyphicon glyphicon-search" style="font-size:95%;"></span>
</button>
</div>
</div>
回答by Valynk
If you are using bootstrap 3, use tag, like this <small><span class="glyphicon glyphicon-send"></span></small>It works perfect for Bootstrap 3.
You can even use multiple <small>tags to set the size more smaller.
Code:<small><small><span class="glyphicon glyphicon-send"></span></small></small>
如果您使用的是 bootstrap 3，请使用标签，就像这样<small><span class="glyphicon glyphicon-send"></span></small>它非常适合 Bootstrap 3。
您甚至可以使用多个<small>标签将大小设置得更小。
代码：<small><small><span class="glyphicon glyphicon-send"></span></small></small>
