LAFINSIR 2023-03-20 22:21 采纳率: 69.2%
浏览 392
已结题

请问怎么通过css改变图片颜色

css怎么改变图片颜色

img

HTML:

   <div class="pic1" style=" background-image: url('https://user-images.githubusercontent.com/8554143/34239266-232bdfc0-e641-11e7-8792-408782aaa78e.png');"></div>

CSS:

.pic1 {
  background-blend-mode: lighten;
  background-size: cover;
  width: 200px;
  height: 200px;
}



HTML标签的style加上属性:linear-gradien

img

HTML:

  <div
                  class="pic1"
                  style="
                    background-image: url('https://user-images.githubusercontent.com/8554143/34239266-232bdfc0-e641-11e7-8792-408782aaa78e.png'), linear-gradient(#f00, #f00);
                  "
                >


因为我这个网站每个客户的主题色不同,我是通过加载不同的css文件来实现的。但是这个background-image的linear-gradient属性怎么分开写,我尝试在class中写linear-gradient,在标签中只写url,但这样好像没效果

.pic1 {
  background-image: linear-gradient(#f00, #f00);
  background-blend-mode: lighten;
  background-size: cover;
  width: 200px;
  height: 200px;
}



  • 写回答

11条回答 默认 最新

  • 阳光宅男xxb 2023-03-21 08:46
    关注

    这个问题的点就是css中的样式和html代码中的样式不能同时生效,所以你这个思路不起作用,建议在html中不设置样式,把图片的url作为变量传入到css中。或者你换种实现方法。

    .pic1 {
      background-image: linear-gradient(#f00, #f00),url("<%=someImageURL%>");
      background-blend-mode: lighten;
      background-size: cover;
      width: 200px;
      height: 200px;
    }
    
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(10条)

报告相同问题?

问题事件

  • 系统已结题 4月2日
  • 已采纳回答 3月25日
  • 创建了问题 3月20日

悬赏问题

  • ¥15 mmocr的训练错误,结果全为0
  • ¥15 python的qt5界面
  • ¥15 无线电能传输系统MATLAB仿真问题
  • ¥50 如何用脚本实现输入法的热键设置
  • ¥20 我想使用一些网络协议或者部分协议也行,主要想实现类似于traceroute的一定步长内的路由拓扑功能
  • ¥30 深度学习,前后端连接
  • ¥15 孟德尔随机化结果不一致
  • ¥15 apm2.8飞控罗盘bad health,加速度计校准失败
  • ¥15 求解O-S方程的特征值问题给出边界层布拉休斯平行流的中性曲线
  • ¥15 谁有desed数据集呀