时间戳

首页 > 解决方案 > 有没有办法只使用 CSS 来编辑具有特定内容的广告跨度？

css - 有没有办法只使用 CSS 来编辑具有特定内容的广告跨度？

问题描述

我有一个问题，我们正在为我们的票务系统使用 SAP，而设计绝对让我很生气。所以我使用 CSS 对其进行更改以使其在某种程度上可以忍受。我现在的问题是他们不断地更改无意义的东西，现在他们甚至删除了 span 元素内的标题。

我试图根据跨度中包含的各种 id 来弄清楚它，但它们是通用的，并且随着每个元素的变化而变化，所以不幸的是我在这里没有运气。

所以基本上我要编辑的是各种优先级，例如： 低 中 高 关键

到目前为止，这通过以下方式起作用：

[title="medium"] {color: #ffc14f !important; font-weight: bold !important;}

然而，正如我所说，他们删除了标题部分，这让我现在真的很困难。

它现在看起来与此类似（缺少标题）：

<span id="dropdownlistboxfBiBbQKnbu_ORlZZW_39-text-listdefintionwN9QyApR3q_23BFLBSdAqG_11-10"
data-sap-ui="dropdownlistboxfBiBbQKnbu_ORlZZW_39-text-listdefintionwN9QyApR3q_23BFLBSdAqG_11-10"
data-sap-automation-id="fBiBbQKnbu_ORlZZW" 
data-help-id="fBiBbQKnbu_ORlZZW"
class="sapMText sapMTextBreakWord sapMTextMaxWidth sapUiSelectable"
style="text-align:left">
Medium
</span>

元素的更多属性：

innerHTML: "Medium"
innerText: "Medium"
outerText: "Medium"

>lastChild: text
>>data: "Medium"
>>nodeName: "#text"
>>nodeType: 3
>>nodeValue: "Medium"

不幸的是，每个元素的 ids（我在此处更改）都会更改，即使它显示相同。因此，即使我尝试搜索这些或部分搜索它们，我也无法使其正常工作。

毕竟跨度内容仍然是“中等”，但我无法找到一种方法来明确找到一种有效的 CSS 方法来识别然后修改它。

这是我到目前为止尝试过的，但没有运气：

[span*=Medium] {color: #ffc14f !important}
[id*=fBiBbQKnbu] {color: #ffc14f !important}
span[innerText="Medium"] {color: #ffc14f !important}
[innerText="Medium"] {color: #ffc14f !important}
[innerHTML="Medium"] {color: #ffc14f !important}

我尝试了上面给出的更多变体，但到目前为止还没有运气。

这让我发疯，如果有人可以在这里帮助我，我将非常感谢您的帮助。

如果需要任何进一步的细节，请告诉我。

标签： css

解决方案

CSS 有不同的属性选择器。

[att]表示具有 att 属性的元素，无论该属性的值如何。

[att=val]表示具有 att 属性的元素，其值正好是“val”。

[att~=val]表示具有 att 属性的元素，其值为以空格分隔的单词列表，其中一个恰好是“val”。如果“val”包含空格，它永远不会代表任何东西（因为单词是用空格分隔的）。此外，如果“val”是空字符串，它永远不会代表任何东西。

[att^=val]表示具有 att 属性的元素，其值以前缀“val”开头。如果 "val" 是空字符串，则选择器不代表任何内容。

[att$=val]表示具有 att 属性的元素，其值以后缀“val”结尾。如果 "val" 是空字符串，则选择器不代表任何内容。

现在你需要在你的跨度中找到一个属性来标识你的跨度的优先级。

考虑到你试过

[id*=fBiBbQKnbu] {color: #ffc14f !important}

也许试试

span[id*=fBiBbQKnbu] {color: #ffc14f !important}

反而。

推荐阅读