html - 如何在 Ionic 2 中应用图像 CSS3 滤镜

Question

我正在尝试通过 CSS3 过滤器提高某些图像的分辨率以自动编辑它，您可以在此链接中找到很多过滤器 https://www.w3schools.com/cssref/css3_pr_filter.asp

无论如何，我的问题是当我尝试在 img 标签内使用 id 或 class 将滤镜应用于一张图像时，没有任何变化发生。

这是我的代码示例

<img src="{{noteImg.url}}" style="height:135px !important; margin=0px -webkit-filter: contrast(200%); filter: contrast(200%);"  #imageToView (click)="viewImg(imageToView)"/>

instead I want to apply the effect on some images.

Answer 1

在您的页面名称中使用您的 Css{}。例如:它将仅应用于此 metion 页面

page-yourPagename {
 img {
   -webkit-filter: contrast(200%); /* Safari */
   filter: contrast(200%);
 }
}

或者尝试使用类名。

page-yourPagename {
 .image {
   -webkit-filter: contrast(200%); /* Safari */
   filter: contrast(200%);
 }
}