css3多重背景小案例

最新推荐文章于 2022-02-21 13:26:36 发布

小斯不斯

最新推荐文章于 2022-02-21 13:26:36 发布

阅读量665

点赞数 1

分类专栏： css3多重背景小案例文章标签： css3多重背景小案例 css3 多重背景

本文链接：https://blog.csdn.net/qq_42181069/article/details/80396580

版权

css3多重背景小案例专栏收录该内容

1 篇文章 0 订阅

订阅专栏

关于多重背景这个css3中很常用的属性，本来没什么可以详细拿出来讲的，但是，昨天，是我们一年一度的520，以及今天是一年一天的521，我这个和代码一起过的小仙女，有脾气了~~~~所以拼个图，来表达一下我此时此刻的心情，效果图如下：

代码如下：

1、css部分：注意一下多重背景的写法就行，只有一个background,图片的话大家可以自己去找好看的，然后就是中间嵌入的图片要找好坐标，大家可以自己量一下

 <style>
        .box {
            width: 623px;
            height: 417px;

            background: 
                url("../img/bg1.png") left top no-repeat,
                url("../img/bg2.png") right top no-repeat,
                url("../img/bg3.png") right bottom no-repeat,
                url("../img/bg4.png") left bottom no-repeat,
                url("../img/fox2.jpg") 113px 84px / 363px 257px no-repeat;
                ;
            border: 1px solid #000;
        }
    </style>

2、html部分：

<body>
    <div class="box">
    
    </div>  
</body>

总结：愿大家每天都有一个好心情~~~~

小斯不斯

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
4
评论
css3多重背景小案例

关于多重背景这个css3中很常用的属性，本来没什么可以详细拿出来讲的，但是，昨天，是我们一年一度的520，以及今天是一年一天的521，我这个和代码一起过的小仙女，有脾气了~~~~所以拼个图，来表达一下我此时此刻的心情，效果图如下：代码如下：1、css部分：注意一下多重背景的写法就行，只有一个background,图片的话大家可以自己去找好看的，然后就是中间嵌入的图片要找好坐标，大家可以自...
复制链接

扫一扫

专栏目录