CSS 如何禁用引导程序 4 卡上的边框
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/50743134/
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
How do I disable the border on bootstrap 4 cards
提问by Victor Johnson
A grey outline keeps appearing on the img section of my bootstrap card, which I would like to remove.
我的引导卡的 img 部分不断出现灰色轮廓，我想将其删除。
<!-- Card deck -->
<div class="card-deck">
<!-- Card -->
<div class="col-md-6 col-lg-4 col-xl-3">
<div class="card mb-4">
<!--Card image-->
<div class="view overlay"><img alt="Work eyewear" class="card-img-top img-fluid" src="img/clothing-1.jpg"></div><!--Card content-->
<div class="card-body">
<!--Title-->
<h4 class="card-title">PPE</h4><!--Text-->
<p class="card-text">PPE is equipment that will protect the user against health or safety risks at work...</p><!-- Provides extra visual weight and identifies the primary action in a set of buttons -->
<a class="" href="https://shop.spartansafety.co.uk/personal-protection-s/1820.htm">SHOP NOW <i class="fas fa-arrow-right fa-xs"></i></a>
</div>
</div>
</div><!-- Card -->
回答by jasonscript
There are border utilitiesthat can help with this. From the link:
有边界实用程序可以帮助解决这个问题。从链接：
Subtractive
<span class="border-0"></span> <span class="border-top-0"></span> <span class="border-right-0"></span> <span class="border-bottom-0"></span> <span class="border-left-0"></span>
减法
<span class="border-0"></span> <span class="border-top-0"></span> <span class="border-right-0"></span> <span class="border-bottom-0"></span> <span class="border-left-0"></span>
So for your scenario, since you want to remove all borders you would add the border-0CSS Class to your cardlike so:
因此，对于您的场景，由于您想删除所有边框，因此您可以将border-0CSS 类添加到您card喜欢的位置：
<div class="card mb-4 border-0">
</div>
回答by John Baker
If you check the .cardclass has a border: 1px solid #e5e5e5;
如果你检查这个.card类有一个border: 1px solid #e5e5e5;
To remove it simply override it to border: none;
要删除它，只需将其覆盖为 border: none;
回答by Wria Mohammed
simply, you can make the border zero, <div class="card border-0">
简单地说，你可以使边界为零， <div class="card border-0">
