Javascript 如何操作生成的CSS

我有这个css样式，它是从Angular模块生成的，所以我不能在那里做任何事情

问题是我想从生成的内容中得到-30px

<div ng2-sticky="" style="box-sizing: border-box; position: static; float: none; top: auto; bottom: auto; width: 1040px; left: auto;">
     Hello World
</div>

你好，世界

由于值随屏幕大小而变化，我希望宽度始终小于30px。因此，对于这个特定的屏幕大小，它应该是

1010px

我不确定我怎么可能在这里使用

calc

，或者是否有其他方法来实现这一点

PS：我无法编辑生成此代码的Javascript，因为它不在我的服务器上。

可以

document.querySelector('[ng2-sticky=""]').style.width = 1010px;

或许

<style>div[ng2-sticky=""] {width:1010px !important;}</style>

div[ng2 sticky=“”{宽度：1010px！重要；}

JS-您可以在JS中执行类似的操作

let element = document.querySelector('div[ng2-sticky]'); 
let width = element.offsetWidth;

let newWidth = width - 30 + "px";
element.style.width = newWidth;

CSS-或者CSS中的简单技巧

div[ng2-sticky]{

  margin: 0 15px;

}

---

所以它会在左右两边留出一个空白

你弄错了我的查询。这个宽度是有响应的，所以它会随着我改变屏幕大小而改变。我需要的是-30px生成的宽度。所以如果它是1040px，它应该是1010px，或者如果它是930px，它应该是900px。必须始终减去30px。然后，由于您的选项有限，我相信您需要使用javascript并在每次调整大小时运行它……笔：您可以侦听调整大小事件并相应地修改宽度

width:calc（100vw-30px）

（带窗口的-30px）或

width:calc（100%-30px）

（容器的宽度-30px）