css - 不允许重复的背景图像 - CSS LINT
问题描述
我有以下 CSS 旨在显示所有浏览器的背景图像:
.single-product.postid-92613 .site-content, .single-product.postid-92613 header#masthead, .single-product.postid-92613 .site-footer, .single-product.postid-92613 .sfb-footer-bar {
background-image: linear-gradient(to bottom, rgba(0, 0, 0, .1), rgba(0, 0, 0, .3)), url("/wp-content/uploads/2020/08/pic.jpg")!important;
background-image: -moz-linear-gradient(top, rgba(0, 0, 0, .1), rgba(0, 0, 0, .3)), url("/wp-content/uploads/2020/08/pic.jpg")!important;
background-image: -o-linear-gradient(top, rgba(0, 0, 0, .1), rgba(0, 0, 0, .3)), url("/wp-content/uploads/2020/08/pic.jpg")!important;
background-image: -ms-linear-gradient(top, rgba(0, 0, 0, .1), rgba(0, 0, 0, .3)), url("/wp-content/uploads/2020/08/pic.jpg")!important;
background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, .1)), to(rgba(0, 0, 0, .3))), url("/wp-content/uploads/2020/08/pic.jpg")!important;
background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, .1), rgba(0, 0, 0, .3)), url("/wp-content/uploads/2020/08/pic.jpg")!important;
background-attachment: fixed!important;
background-size: cover!important;
background-position: 100% 0!important;}
background-image
CSS lint 给出了一个被多次调用的警告。有什么办法可以防止这种情况发生吗?
解决方案
还要在 CSS 中添加:
background-repeat:no-repeat;
推荐阅读
- javascript - 在 Nuxt 项目中引发 JavaScript 堆内存不足错误
- flutter - Windows 中出现缓慢的内容
- java - ConcurrentHashMap 的 compute、computeIfAbsent 和 computeIfPresent 方法是完全原子的吗?
- javascript - 我的响应式 UI 在引导程序中没有响应
- python - pygraphviz中不同形状的节点
- html - 背景全屏 100vh 但如果屏幕垂直最小化则更大
- android-recyclerview - 如何修复 NullPointerException?
- r - 根据范围条件选择列并包含 NA 值
- python - 在python中自动传递一个变量
- javascript - 使 Textarea 足够适合 maxLangth 属性