Question

我安装了open iconic插件，我想强制设置图标的大小在原始库中，有一个用于更改大小的属性，但是在Bootstrap的版本上似乎不起作用。还有什么其他方法可以改变字体大小？

<div class="badge badge-primary badge-pill"><span   class="oi oi-thumb-down">
</span></div>

Answer 1

最近在开放式图标上出现了一个反应性问题，发现这个问题没有得到解答；对于正常（非reactJS）使用打开图标的情况，font-size属性将按如下所示工作；

使用引导程序v3的代码段：

span {
  font-size: 30px;
}

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/open-iconic/1.1.1/font/css/open-iconic-bootstrap.min.css" integrity="sha256-BJ/G+e+y7bQdrYkS2RBTyNfBHpA9IuGaPmf9htub5MQ=" crossorigin="anonymous" />

<span class="oi oi-sort-ascending"> </span>
<span class="oi oi-person"> </span>

使用引导程序v4的代码段：

span {
  font-size: 30px;
}

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-beta/css/bootstrap.min.css" integrity="sha256-m/h/cUDAhf6/iBRixTbuc8+Rg2cIETQtPcH9D3p2Kg0=" crossorigin="anonymous" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/open-iconic/1.1.1/font/css/open-iconic-bootstrap.min.css" integrity="sha256-BJ/G+e+y7bQdrYkS2RBTyNfBHpA9IuGaPmf9htub5MQ=" crossorigin="anonymous" />

<span class="oi oi-sort-ascending"> </span>
<span class="oi oi-person"> </span>

Answer 2

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-beta/css/bootstrap.min.css" integrity="sha256-m/h/cUDAhf6/iBRixTbuc8+Rg2cIETQtPcH9D3p2Kg0=" crossorigin="anonymous" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/open-iconic/1.1.1/font/css/open-iconic-bootstrap.min.css" integrity="sha256-BJ/G+e+y7bQdrYkS2RBTyNfBHpA9IuGaPmf9htub5MQ=" crossorigin="anonymous" />

<span class="oi oi-sort-ascending h1"> </span>
<span class="oi oi-person h2"> </span>

Bootstrap开放式图标调整大小

2 个答案: