左边的一个部分有两个css类边框答案

【问题标题】：Two css class border on the one part left左边的一个部分有两个css类边框
【发布时间】：2014-08-19 23:53:00
【问题描述】：

我要上课了

<div class="thread-entryresponse">
<div class="date">


 </div>
 </div>

然后

<div class="thread-entrymessage">
<div class="date">
</div>
 </div>

我的css代码是

.thread-entryresponse {
    border-left: 2px solid #428bca;
    color: #444;
    padding: 10px; 
}

.thread-entrymessage {
    border-right: 2px solid #444; 
}

.date {
    color: #444;
    margin-top: 20px;
    padding: 10px; 
}

我正在尝试在下面做

如果.thread-entryresponse 和.date 然后border-left: 2px solid #428bca; 在日期
如果.thread-entrymessage 和.date 然后border-right: 2px solid #444; 日期

注意日期在thread-entryresponse和thread-entrymessage中

【问题讨论】：

你的 div 是嵌套的还是兄弟的？

标签： html css class css-selectors border

【解决方案1】：

如你所说：

.date 在.thread-entryresponse 和.thread-entrymessage 内

这意味着 .date 是 .thread-entryresponse 和 .thread-entrymessage 的后代。要根据父级改变.date 的样式，请使用后代选择器：

标记：

<div class="thread-entryresponse">
    <div class="date"></div>
</div>


<div class="thread-entrymessage">
    <div class="date"></div>
</div>

CSS：

.thread-entryresponse .date {
    border-left: 2px solid #428bca;
}

.thread-entrymessage .date{
    border-right: 2px solid #444;
}

Demo

【讨论】：

啊，在我发布这个的时候，一个答案被接受了。抱歉重复一遍。

【解决方案2】：

首先，我强烈建议你学习 HTML/CSS 的基础知识

第二，你可以用这个

DEMO

.thread-entryresponse .date {
    border-left: 2px solid #428bca;
}
.thread-entrymessage .date {
    border-right: 2px solid #444;
}

【讨论】：

嘿，对不起，我放错了它是

我看到它在你的演示但在我的页面上不起作用
@user3606549 什么意思？