给网站加好看霸气的老虎福字背景图代码分享

给网站加好看霸气的老虎福字背景图代码分享插图

马上要到2022春节虎年了,红色系看着都是喜庆的氛围。逛网时无意中看到这个老虎福字的背景图,觉得很不错,所以这次顺便分享给网页添加背景的两种不同模式方法代码,给网站博客美化一下都是很不错的,下面就一起来看看吧。

如果学过点网页有基础的,看下代码应该就知道含义了,可以忽略了,难免会有小白新手,所以我这里还是简单说一下两种模式的区别。

看自己选择的背景适合哪个代码,两个代码选一个即可,将代码复制到网页的头部<head>之中即可,背景图也是可以改成自己喜欢的图,修改代码url后面的图片地址就可以了,

代码1:

添加的网页背景图,会将图片平铺重复出现多个,随着不断滚动的,会出现多个一样的背景图。

/* 大雄搜集站(soujiz.com) */
 body {
    background-image: url(https://soujiz.com/wp-content/uploads/2022/01/2022bj2-2.png);
    background-position: center center;
    background-size: auto;
    background-repeat: repeat; // 平铺
    background-attachment: scroll; //滚动,固定方式
} 

代码2:

这种就是会把添加的背景图给固定住,而且不会将图片平铺重复出现多个。也就是你现在在本站看到这种效果。

/* 大雄搜集站(soujiz.com) */
body {
    background-image: url(https://soujiz.com/wp-content/uploads/2022/01/2022bj2-2.png);
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat; 
    background-attachment: fixed;
} 

图片素材:也给你准备好了,点开上面的图,长按保存下载即可。

© 版权声明
THE END
喜欢点个赞支持一下吧
点赞0赏币
分享
评论交流 抢沙发

请登录后发表评论