Question

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

问题在于我想从生成的内容中获取-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，因为它不在我的服务器上。

Answer 1

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;

}

因此它会为左右提供边距

Answer 2

你可以

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

或者

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

如何操纵生成的CSS

2 个答案: