我正在练习 Angular ,我有一些页面有一个名为“MainImg”的主图像。在 CSS 中,它的格式如下:
.main-section__main-image{
background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url({{ settings["MainImg"] }}) top no-repeat;
background-size: cover;
}
所以在我的 Controller 中使用 MainImg 将显示具有相应设置的图像。
但是,有些图片太大或太宽,我想以不同的方式设置它们的格式。我怎样才能将背景大小更改为仅包含某些图片?该应用程序是数据驱动的,因此设置将应用于所有名为 MainImg 的图片。
最佳答案
需要更多关于您的 Controller 和可能的模型的上下文,但您可以尝试以下方法。
为 className 添加一个字段到 MainImg
。这将包含“main-section__main-image”或包含“main-section__main-image main-image__cover”,具体取决于您是否需要为相关图像设置 background-size
.
在您的 View 中使用 ng-class
指令从该字段中读取所需的类。
将 CSS 中的 background-size
规则移动到新的 .main-image__cover
类,它应该可以工作。
关于javascript - angularjs:将背景大小从覆盖更改为包含,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46895884/