Typecho主题自定义Canvas背景特效
2023-02-18 16:43:06 时间
什么是Canvas
看见本站动态背景了吗?它就是基于Canvas技术实现的。 Canvas 是 HTML5 中一个新特性,开发者绘制一系列图形。通过和JavaScript配合,可以使静态的图形动起来~
如何自定义Canvas背景?
- 首先,需要将要引入的背景文件,放入网站的目录下,并且保证可以读取。
- 然后进入主题设置,自定义JS,中填入下面的代码:
#例如
同款主题设置全透明CSS样式:
.post{
background: rgba(255, 255, 255, 0.8);
}
如果还要修改侧边栏样式,可追加下面的内容:
.sidebar .widget {
background: rgba(255,255,255,0.8);
}
相关文章
- 打赌你不知道的两个await使用细节
- 不得不知道的Flutter异常捕获知识点:Zone
- Flutter异常监控 | 框架Catcher原理分析
- Flutter异常捕获 | 从bugsnag源码学习如何追溯异常产生路径
- 可实现电源驱动五种功能
- 端口映射及容器互联
- 实战:使用Dockerfile创建镜像
- 从源码角度学习JVM类加载器及自定义类加载器
- 彻底搞懂双亲委派机制 顺便学点源码技巧
- JVM 彻底搞懂JVM内存区域及直接内存
- JVM 一张图带你了解内存分配过程 搞懂逃逸分析|标量替换|指针碰撞|空闲列表|TLAB
- JVM 什么样的对象会直接进入老年代?
- JVM 彻底搞懂什么是老年代空间分配担保机制
- JVM 彻底搞懂几种常见的垃圾回收机制|标记清除|标记复制|标记整理
- JVM 别和我说你还不知道这几种垃圾回收器?Serial |Parallel|ParNew|CMS|G1|ZGC
- 你知道JVM 是如何解决并发标记过程中:多标和漏标的情况么?
- 7分钟掌握 ByteBuf 和 ByteBuffer 工作原理及区别
- 如何使用 SEGGER Embedded Studio创建库文件?
- stm32CubeIDE中CMSIS_V1和CMSIS_V2选项的区别
- 性能之巅-优化你的程序