我正在使用具有以下CSS的降价编辑器中的CSS样式表。
p strong {
font-size: larger;
}
在呈现的HTML中，标题始终为
形式<p><strong>title</strong></p>
例如
<p><strong>Example of adding a new persistent rule</strong></p>
然后我用粗体字表示的常用段落表示为：
<p> text text text <strong>red text</strong> text text <strong>red tezt</strong></p>
我想更改或修改CSS，以便只有<p><strong>title</strong></p>中的文字的文字以不同的颜色显示。
请任何人帮助处理所需的CSS。我尝试了各种兄弟选择器组合，但没有任何效果。通常在Chrome开发工具中，我尝试过的内容p+strong {color: red;}显示为灰色且无效。
非常感谢。
答案 0 :(得分：1)
这不是兄弟选择器，而是（直接）child selector
因此，你应该使用：
p > strong
＆gt;组合器分离两个选择器并仅匹配那些选择器 第二个选择器匹配的元素是直接子元素 第一个匹配的元素。相比之下，当两个选择器是 结合后代选择器，组合选择器 表达式匹配第二个选择器匹配的元素 哪个存在与第一个选择器匹配的祖先元素， 不管＆＃34;跳数＆＃34; DOM。
兄弟选择器是一个识别相同级别的DOM节点的选择器。您strong
p元素
p + strong {
text-decoration: underline; /* directly adjacent sibling (wont apply) */
}
p ~ strong {
font-style: italic; /* adjacent sibling (wont apply) */
}
p > strong { /* (direct) child (applies) */
color: red;
}<p>text text text <strong>red text</strong> text text <strong>red tezt</strong>
</p>
答案 1 :(得分：0)
请参阅下面的codepen示例
http://codepen.io/jmonit/pen/wBrWgW
Lorem Ipsum只是印刷和排版行业的虚拟文本。 Lorem Ipsum自16世纪以来一直是业界标准的虚拟文本，当时一个未知的打印机拿了一个类型的厨房并乱扰它制作一个类型的样本书。它不仅存在了五个世纪，而且还存在电子排版的“强势”，基本保持不变。它在 20世纪60年代随着包含Lorem Ipsum段落的Letraset表格的推出而普及，最近还推出了包括Lorem Ipsum版本在内的桌面出版软件Aldus PageMaker。
p strong{ color:red; font-size: larger; }
你使用的同一个css在改变颜色方面有什么不同吗？在链接中我使用了markdown代码来生成段落和强标记。如果这有帮助，请告诉我。
答案 2 :(得分：0)
正如SW4所提到的，你使用兄弟选择器的方式是不正确的，因为strong元素是p元素的 children ，而不是兄弟姐妹。换句话说，strong元素由p > strong表示，而不是p + strong。
您似乎希望在
时以不同方式设置strong元素的样式
strong和p元素
strong元素中; p。第一部分可以使用p > strong:only-child或p > strong:only-of-type来实现。但是因为text nodes and other non-element nodes are always ignored by structural pseudo-classes，这也会针对这个例子中的元素：
<p>text text <strong>red text</strong> text text</p>
你可能不想要的。不幸的是，由于这个原因，仅使用CSS选择器无法完成第二部分。
正如我在评论中提到的那样，您可以通过仅将部分标题放在正确的标题元素which Markdown supports中，并将这些标题作为目标来轻松避免所有这些。但是，如果您的Markdown 的实现不支持任何原因的标题，或者您无法修改Markdown内容，那么除非您编写脚本来检测这些元素，否则您可能会运气不好给他们一个班级名称，或者将它们交换成实际的标题。