为 RTL 和 LTR 语言分别设置每个段落的样式

开发
1

你好，我尝试在 Discourse 中同时使用 RTL 和 LTR 语言。我原本打算通过 CSS 来解决这个问题，因为内容中的段落顺序是固定的。起初我计划使用 nth-of-type 来选择 p 标签。但出现了一个意外情况：在 Discourse 中添加的图片会自动在前后生成 p 标签。这导致 nth-of-type 无法正常工作，因为无论内容中是否包含图片，我需要定位的段落数量都发生了变化。

image
image1186×294 41.3 KB

.cooked > p:nth-of-type(5) {
  color: brown; 
  font-size: 16px;
}

因此，我开始考虑另一种解决方案。我寻找了一种方法来定位带有 RTL 和 LTR 标签的段落。

:nth-of-type() of [attribute=value]

.cooked > p[dir="ltr"]:nth-of-type(1) {
  color: brown; 
  font-size: 16px;
}

这不起作用。因为浏览器会优先处理 nth-of-type。似乎无法将 nth-of-type 或 nth-child 与属性选择器结合使用。

您有什么解决方案建议吗？