通过 Tritium 更改样式属性答案

【问题标题】：Changing the style properties via Tritium通过 Tritium 更改样式属性
【发布时间】：2013-05-22 21:24:31
【问题描述】：

新手问题，我正在处理一个简单的场景：使用 Tritium 在我的页面上更改背景颜色和给定元素的文本。我的页面如下所示：

<div class="hero" id="hero">
<div id="heroContentShort">
    <div class="heroContentShort">
        <h1 style="text-transform:capitalize;">My Text<span style="text-decoration:underline;font-weight:bold;"><a href="/pages/new.html" style="color:#FFFFFF">- on Moovweb</a></span></h1>
    </div>
</div>

在我的 .TS 文件中，我有以下内容：

insert("div", class:"cus_title"){
    insert("div", class:"cus_row1"){
      move_here("//div[@id='hero']/div/div/h1")
      attribute("background", "red")
      text("My New Text")
    }
  }

以上内容已成功更改文本，但未保留任何格式，也未将背景颜色更改为红色。

我做错了什么？

谢谢

【问题讨论】：

标签： css moovweb tritium

【解决方案1】：

首先，我强烈建议您不要使用氚进行着色。 DOM 和样式应该是分开的。如果您不想创建自己的页面，我建议您将其放在 main.scss 文件的底部。然后你会这样做：

.cus_row1 {
  background-color: red;
}

这将使背景颜色完美且正确地工作。

但是，如果（出于某种原因）您必须在氚中执行此操作，我会改为执行此操作：

  insert("div", class:"cus_title"){
    insert("div", class:"cus_row1"){
      move_here("//div[@id='hero']/div/div/h1")
      attribute("style", "background-color: red")
      text("My New Text")
    }
  }

第一个原因是背景属性已被弃用。其次，用户代理样式表可以覆盖它。我希望这对你有用！

【讨论】：