Waxy主题:自定义网站背景

本篇文章为Waxy主题设置中自定义CSS/JS的高级应用。

如何自定义网站静态背景?

body {
    /*背景颜色*/
    background-color:#990505;
    /*背景图片url,可与上一项同时使用*/
    background-image: url(https://pic.idzd.top/usr/bg/5f6eeefb319ae1601105659386.jpg);
    /*背景图片重复方式,此处为不重复*/
    background-repeat: no-repeat;
    /*背景图片起始位置,此处为居中*/
    background-position: center;
    /*背景图片尺寸,此处为填充模式*/
    background-size: cover;
    /*背景图片是否滚动,此处为不滚动*/
    background-attachment: fixed;
}

Waxy主题:自定义Canvas背景

本篇文章为Waxy主题设置中自定义CSS/JS的高级应用。

什么是Canvas?

Canvas 是 HTML5 中一个新特性,开发者绘制一系列图形。通过和JavaScript配合,可以使静态的图形动起来~

当然更加具体的内容,还请您自己学习,这里不做展开~

后面飞扬的花瓣就是基于Canvas技术实现的后面飞扬的花瓣就是基于Canvas技术实现的

如何自定义Canvas背景?

目前Waxy主题支持3种方式自定义Canvas背景,在文章后面,我提供了几个整理好的背景。

Manjaro 安装 VMtools 方法

最近一段时间,有点嫌弃debian的软件仓库更新太慢,决定试试滚动更新的Manjaro

因为不是很熟悉这个系统,现在虚拟机上试试。

如果不安装 VMtools ,用起来很麻烦,比如无法快捷传文件(这个好说,文件共享就行)。

但是,显示分辨率这个问题,就很麻烦,因为默认都是4:3的。自定义的话,重启后会失效(感觉像我的锅)。

查阅网上的教程,发现问题也就解决一半,折腾半天,终于搞定了。在这记录下

Waxy主题:社交分享图标功能介绍

如何添加

社交/分享图标设置社交/分享图标设置

# 格式(请用半角逗号分隔):名称,地址;

# 一行一条,不需要的图标不填写即可;

# 可自定义顺序;

rss,<你的网站地址/feed>
github,<你的GitHub主页地址>
facebook,<你的脸书地址>
twitter,<你的推特地址>
telegram,<你的电报地址>
email,<mailto:你的邮箱地址>
weibo,<你的微博地址>
wechat,<你的微信公众号二维码图片URL>

如何自定义

因为考虑到体积的问题(主题体积越小加载越快),我们不可能内置所有的图标。

但是,考虑到您可能有需要,我们提供了自定义CSS样式功能。

以添加码云图标为例,我们来看看如何使用这项强大的功能。

选择你喜欢的图标

任何图片都可以,但是为了美观与速度,建议选择32x32大小的图片。

这里推荐 Iconfont-阿里巴巴矢量图标库