Question

所有类别页面上的面包屑下方都显示了2行。边框底部CSS设置为

border-bottom: 1px solid #color

对边距，填充或边框宽度进行任何更改都不会将边框底部更改为仅1行。需要知道如何使它成为一条线。

网站网址：http://www.catholic-collectibles.com/blroandpasa.html

Answer 1

您描述的样式是为.breadcrumbs设置的，并且您有两个嵌套的div与此类，因此样式应用于两者。从其中一个元素中删除该类，或将样式定义更改为仅应用于正确的元素。

Answer 2

<div class="breadcrumbs">
    <div class="breadcrumbs">
        <a href="index.html"> Home</a>
        <a href="shop-by-brand.html">Shop By Brand</a>
        <a href="shop-by-brand-bliss.html">Bliss</a>
    </div>
</div>

你需要删除一个div或添加这个css（这个css删除内部.breadcrumb上的边框）：

.breadcrumbs > .breadcrumbs {
    border: none;
}

Answer 3

如果您无法更改第二个.breadcrumbs课程，则可以执行此操作：

.breadcrumbs .breadcrumbs:nth-child(1) {
    border: none;
}

Answer 4

如果你不能删除外部.breadcrumbs div，最简单的方法就是使用

.breadcrumbs .breadcrumbs { border: none }

保证在外部.breadcrumbs div中有多少.breadcrumbs你没有任何额外的行。

如何删除面包屑下面的双边框底线

4 个答案: