
自定义博客园博客的背景图片
发布日期:2021-05-09 01:47:07
浏览次数:15
分类:博客文章
本文共 737 字,大约阅读时间需要 2 分钟。
看到别人的博客背景自己也想弄一个,搜了很多方法,但是都只是把一堆代码贴着,完全没有告诉我设置背景图片的代码到底是什么,自己研究了一下,现在把它分享给跟我一样有好奇心的朋友。
步骤一共2步
1.上传图片到相册
首先把自己想要做背景的图片上传到博客园,步骤如下:
首先进入到自己的博客,然后点击管理,如下
点击相册
创建一个相册(如果自己有可以不用创建,这里看自己)再把图片上传上去
到止,图片就成功上传到博客园的服务器了。
2.自己编写css代码
要想设置背景图片,思考一下,是不是只需要把背景换成我们的图片地址就行了,设置background-image
属性就可以了,现在拿到图片的地址就可以了,进入上面我们创建的相册。
点开相册,打开我们所需要的图片,然后点击查看原图
最后复制图片地址即可
页面定制 CSS 代码
body{ background-image:url(https://images.cnblogs.com/cnblogs_com/ctf99525/1932586/o_210218052305202103.jpg); background-attachment:fixed; //设置背景图像是否固定或者随着页面的其余部分滚动}
现在博客的背景就是这张图片了。
如果想要透明效果,可以在#home
加一个opacity
属性,opacity
属性指定了一个元素后面的背景的被覆盖程度。规定不透明度从 0.0 (完全透明)到 1.0(完全不透明)。
#home{ opacity:0.8; //0.0到1随便设置,越低越透明}
到此博客的背景图片就设置完成了
如果有帮助到你,动动手指点个推荐,有什么问题可以在评论区写出来,大家一起交流。
发表评论
最新留言
留言是一种美德,欢迎回访!
[***.207.175.100]2025年04月15日 10时04分51秒
关于作者

喝酒易醉,品茶养心,人生如梦,品茶悟道,何以解忧?唯有杜康!
-- 愿君每日到此一游!
推荐文章
RDD partitioner入门详解
2019-03-15
presto查询报错
2019-03-15
superset报错
2019-03-15
Hive 分组取Top N
2019-03-15
yarn开启Label Scheduler
2019-03-15
Spark sample入门到精通
2019-03-15
C++ Primer Plus【复习笔记】-【复合类型】
2019-03-15
前端一些要会的知识点
2019-03-15
VUE +ElementUI form表单回车提交
2019-03-15
使用Spring AOP应该注意的一个小细节
2019-03-15
学习Swoole之进程队列之间通信
2019-03-15
docker 快速安装bcmath扩展
2019-03-15
2020-08-26
2019-03-15
shell脚本一键删除php7.4.8
2019-03-15
vue 基础之计算属性
2019-03-15
nginx服务器部署Thinkphp 5.1框架报404解决方案
2019-03-15
Tomcat内存溢出解决方案
2019-03-15
上传按钮的设计
2019-03-15
thinkphp 的一些重要知识点
2019-03-15