Html 以类的最后一个子容器为目标的CSS

不确定这是否仅适用于CSS。感谢您的帮助

我的HTML如下所示：

<div class="row invoice with-tax">
    <div class="mobile-body-header mobile"><strong>Items</strong></div>
    <div class="invoice-item">
        <div class="item-filler"></div>
        <div class="quantity">2</div>
        <div class="amount-mobile total">$13,336.60</div>
        <div class="item-number">ABC123</div>
        <div class="title"><span class="quantity-mobile">2 x </span>Dance classes and tutoring for upcoming Michael Jacksons</div>
        <div class="amount-item-ex">$153.00</div>
        <div class="amount-subtotal">$306.00</div>
        <div class="amount-tax">$30.60</div>
        <div class="amount-total total">$13,336.60</div>
        <div class="item-filler"></div>
    </div>
    <div class="invoice-item">
        <div class="item-filler"></div>
        <div class="quantity">2</div>
        <div class="amount-mobile total">$13,336.60</div>
        <div class="item-number">ABC123</div>
        <div class="title"><span class="quantity-mobile">2 x </span>Dance classes and tutoring for upcoming Michael Jacksons</div>
        <div class="amount-item-ex">$153.00</div>
        <div class="amount-subtotal">$306.00</div>
        <div class="amount-tax">$30.60</div>
        <div class="amount-total total">$13,336.60</div>
        <div class="item-filler"></div>
    </div>
    ....
 </div>

也

也

---

由于它是一个电子邮件模板，有些模板不支持

：last child

。不要使用

：last child

，而是尝试向要选择的

div

添加一个新类。

尝试

div.invoice-item:last of type>div.title{border:none；}

更新

因为有一个未知的CSS邪恶，这里有一个可能有效的技巧：

div.invoice-item:type的最后一个>div.title.title{border:none！重要；}

---

div{
边框底部：1px纯红；
}
/*分类发票-项目：类型>分类标题的最后一个{
边界：无；
} */
div.invoice-item：类型>div.title.title的最后一个{
边界：没有！重要；
}

项目
2.
$13,336.60
ABC123
为即将到来的迈克尔·杰克逊提供2个舞蹈班和辅导
$153.00
$306.00
$30.60
$13,336.60
2.
$13,336.60
ABC123
为即将到来的迈克尔·杰克逊提供2个舞蹈班和辅导
$153.00
$306.00
$30.60
$13,336.60
....

你看到了什么？你的第一个答案似乎很好，per-你可能在其他地方有一个更强的选择器设置了边框？你能发布定义边框的CSS吗？试试

边框：无！重要的覆盖更强的选择器？你好@Steve，谢谢！我应该尝试使用JSFIDLE路由来隔离。我会同意你的建议。非常感谢！您好@zer00ne，谢谢您的帮助，但是根据上面的建议，尽管我可以看到它在小提琴上工作，但它不适合我，我似乎不知道为什么。边框设置在我试图修复的语句的正上方。@Therelapa您尝试过更新吗
div.invoice-item:type>div.title.title的最后一个{border:none！important；}
Hi@ze00ne是的，但结果相同。其他原因导致了这一点不起作用。谢谢你的帮助。@Therelapa你把
.title
翻了一番？（例如，
div.title.title
）@TheRealPapa我想我们需要一把小提琴来摆弄包括在内的所有CSS。嗨@Naouras谢谢你的建议。动态构建模板时，我必须对最后一行类进行编码。只需向那些
div
s添加一个新类即可。祝你好运
div.invoice-item > div.title {
    border-bottom: 2px dotted red;
}
div.invoice-item:last-child > div.title {
    border: none !important; 
}

div.invoice-item > div.title {
    border-bottom: 2px dotted red;
}
div.invoice > div.invoice-item:last-child > div.title {
    border: none !important; 
}

div {
  border-bottom: 1px solid red;
}
div.invoice-item:last-of-type > div.title {
  border: none;
}