我需要取消（而不是反击）父 CSS 文件的效果

Question

首先，我正在开发“rtl”定向网页。 而且，我在我的 shop.html 模板中使用了名为“breadcrumbs”的引导组件。因此，我希望我的面包屑从右到左方向。

<div class="breadcrumb">
    <div class="container" align="right">
        <a class="breadcrumb-item" href="{% url 'bookrepo:home' %}">صفحہ اول</a>
        <span class="breadcrumb-item active"> خریداری </span>
    </div>
</div>

我已经制作了自己的 shop.css 文件，用于定制样式。现在，问题是尽管我在模板中完成了align:"right"。

但是引导程序的父文件覆盖了它向左的位置。作者：(https://maxcdn.bootstrapcdn.com/bootstrap/scss/_breadcrumb.scss)：

.breadcrumb-item {
float: left;
}

所以，现在是这样的：

我希望它漂浮在哪里：对。所以我在 shop.css 中所做的是：

.breadcrumb-item {
float: right;
}

但它并没有按计划进行。它正在破坏面包屑的方向。看看它：

所以，这意味着我不希望它向任何一个方向浮动。当我取消应用两者时，它工作正常。

看看吧：

显然，我可以从我的 shop.css 中删除 float:right。所以，现在指导我如何取消引导程序的 css 效果，即float:left。

Answer 1

你需要清除浮动

.breadcrumb-item {
clear:both;
float: right;
}