Html 我该如何设计<；代码>；仅当其父级不是<；pre>；？

我正在集成wmd编辑器，就像这里使用的一样

对于内联代码块，如

this

，生成的html为：

<code>this one</code>

<pre>
  <code>var i = 0;</code>
  <code>var j = 0;</code>
<pre>

对于多行代码，如：

var i = 0;
var j = 0;

生成的html是：

<code>this one</code>

我为它们提供了单独的css：

pre{…}

和

code{…}

现在，我希望

样式仅在其父项不是
时应用

我试过使用
code:not（pre-code）{…}
，但似乎不起作用

我可以保证上面的HTML结构

它可以通过css解决吗

CSS中没有父选择器。您唯一的选择是为没有

替代解决方案包括JavaScript。
：如果
code
元素是
pre
元素的直接子元素，则不（pre）>code{…}
应该可以完成这项工作。
这是非常低效的，并且如果页面上有大量回流，会延迟相当长的时间。也许，但是你的建议很难说是未来的证明。@SecondRikudo我的网站不会是一个代码共享或代码密集型的网站，HTML的结构可以得到保证。使用这个答案还会对性能产生巨大影响吗？@Second Rikudo:为什么效率很低？考虑到大多数实现，这最多会对已经在计算的任何现有
code
元素添加额外的检查。@Amit Joki:事实上，如果它不总是作为直接后代出现，那么最终会出现一组全新的问题。请参阅问题不需要父选择器；而是子选择器（如
预编码
）。还有一个直接的解决方案，由@rightfold描述。但是，这里建议的解决方案有一些好处，比如全面的浏览器支持（与几乎全面的浏览器支持相反），以及同时使用子选择器和子代选择器（例如
pre>code
或
pre-code
）的可能性。另一方面，它要求对那些不在
pre
元素内的
code
元素使用一些显式设置。