CSS如何使背景图像像图片一样散乱

CSS如何使背景图像像图片一样散乱,css,Css,大家好,我在为div设置背景图像时遇到问题。我想为div设置一个完整的背景图像。几乎完成了,但颜色不正确。我的画是渐变色的 我的CSS代码 .cards-section .item-wrapper .item-inner.category_blue { background: url('./images/post_blue.png') no-repeat center center fixed; -webkit-background-size: cover; -moz-b

大家好,我在为div设置背景图像时遇到问题。我想为div设置一个完整的背景图像。几乎完成了,但颜色不正确。我的画是渐变色的 我的CSS代码

.cards-section .item-wrapper .item-inner.category_blue {
    background: url('./images/post_blue.png') no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
设计

我的礼物

颜色不同。你知道怎么修吗

HTML代码

<div class="row cards-wrapper">
   <div class="card col-md-4 col-sm-12">
      <div id="post-34" class="card_wrapper post-34 post type-post status-publish format-standard hentry category-uncategorized">
         <div class="card_header card_inner fullBackgroundImage category_purple">
            <h5 class="card_header_category">Uncategorized</h5>
            <hr class="card_header_category_break">
            <h3 class="card_title">Post 1</h3>
            <p class="card_modified">Last update: November 21, 2018</p>
         </div>
         <div class="card-body  while">
            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Adipiscing elit duis tristique sollicitudin nibh. Cras semper auctor neque vitae tempus. In cursus turpis massa tincidunt dui ut. Dui nunc mattis enim ut. Semper quis lectus nulla at volutpat diam ut venenatis tellus. Diam volutpat</p>
         </div>
      </div>
   </div>
</div>

未分类

职位1 上次更新:2018年11月21日

知识是一种美德,是一种美德,是一种美德,是一种美德。另一位精英是索利西图丁·尼布。克拉斯·森佩尔拍卖人内克·维塔·坦普斯。在turpis cursus massa tincidunt dui ut。酒后驾车。在维内那提斯岛的一个广场上,有一个教堂。蜗壳直径

背景图像


如果希望背景图像像图像一样拉伸,可以使用

background-size: 100% 100%

所以,无论容器大小,图像都会拉伸以填充它。

这只是因为背景附件的固定属性。当用户滚动该元素时,图像将调整大小以填充整个空间。所以图像更大,你看不到整个图像


如果您确实不需要固定属性,请尝试删除它。

如果您有颜色选择器,请获取颜色代码并使用background:linear-gradient(),而不是background-image。您也可以提供html吗?您的css背景图像只能覆盖它作为背景的div的大小,因此只能与div一样大。@Wernerson我更新了html代码请发布整个html代码,因为我没有看到任何分类命名卡选择、项目包装或任何其他css选择器。@Wernerson我发布了整个html代码。但我认为没必要,我看不出有什么不同。和背景尺寸一样,不太一样。封面调整背景图像的大小,但保持比例(因此图像的某些部分不可见),同时拉伸背景图像以填充容器,无论图像/容器的比例如何,整个图像始终可见。你可以在这里读到更多:是的,但在这种情况下,百分比和覆盖率之间的差异非常小,几乎相似。这是不对的。没有背景附件固定。背景图像无法完全拉伸,所以可以编辑该背景图像并使其更宽,因为浏览器希望按比例缩放该背景。