Bootstrap icon remove：：before

t2a7ltrp 于 5个月前发布在 Bootstrap

关注(0)|答案(1)|浏览(71)

我添加引导图标动态，我希望这些出现在新的行。然而，结果是，图标和文本出现在同一行。见图片
x1c 0d1x的数据
这是生成的代码：

<div class="row ml-1" id="refine">
  <br>
  <i class='bi bi-trash'>
    ::before
  </i> 
    "A1 - North Somerset core strategy"
  <br>
  <br>
  <i class='bi bi-trash'>
    ::before
  </i> 
    "Ashton Vale"
  <br>
  <br>
  <i class='bi bi-trash'>
    ::before
  </i> 
    "NPPF Sept 23"
  <br>
 </div>

字符串
我怎样才能让图标/文本出现在单独的行上？这是不是和自动生成的::before有关？如果是，我怎么抑制它？

twitter-bootstrap

来源：https://stackoverflow.com/questions/77606855/bootstrap-icon-remove-before

1条答案

按热度按时间

p3rjfoxz1#

只需将#refine div的类row更改为col，如下所示：

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">

<div class="col ml-1" id="refine">
  <br>
  <i class='bi bi-trash'></i> 
    "A1 - North Somerset core strategy"
  <br>
  <br>
  <i class='bi bi-trash'></i> 
    "Ashton Vale"
  <br>
  <br>
  <i class='bi bi-trash'></i> 
    "NPPF Sept 23"
  <br>
 </div>

字符串
而：：before不是DOM的一部分，它只是浏览器中伪元素的一个标记。

赞(0）回复(0）举报 5个月前

我来回答

Bootstrap icon remove：：before

1条答案

相关问题

热门标签

最新问答