Hello World

Welcome to Hexo! This is your very first post. Check documentation for more info. If you get any problems when using Hexo, you can find the answer in troubleshooting or you can ask me on GitHub.

Quick Start

Create a new post

$ hexo new "My New Post"

More info: Writing

Run server

$ hexo server

More info: Server

Generate static files

$ hexo generate

More info: Generating

Deploy to remote sites

$ hexo deploy

More info: Deployment

行内文本样式 text

  1. 下划线 的文本
  2. 着重号 的文本
  3. 波浪线 的文本
  4. 删除线 的文本
  5. 键盘样式的文本 command + D
  6. 密码样式的文本:这里没有验证码

行内文本 span

  • 彩色文字
    在一段话中方便插入各种颜色的标签,包括:红色黄色绿色青色蓝色灰色
  • 超大号文字
    文档「开始」页面中的标题部分就是超大号文字。
A Wonderful Theme for Hexo

段落文本 p

  • 彩色文字
    在一段话中方便插入各种颜色的标签,包括:

    红色

    黄色

    绿色

    青色

    蓝色

    灰色

    。 - 超大号文字 文档「开始」页面中的标题部分就是超大号文字。

    A Wonderful Theme for Hexo

    ## 引用 note 1. simple样式

    默认 提示块标签

    default 提示块标签

    primary 提示块标签

    success 提示块标签

    info 提示块标签

    warning 提示块标签

    danger 提示块标签

    2. modern样式

    默认 提示块标签

    default 提示块标签

    primary 提示块标签

    success 提示块标签

    info 提示块标签

    warning 提示块标签

    danger 提示块标签

    3. flat样式

    默认 提示块标签

    default 提示块标签

    primary 提示块标签

    success 提示块标签

    info 提示块标签

    warning 提示块标签

    danger 提示块标签

    4. disabled样式

    默认 提示块标签

    default 提示块标签

    primary 提示块标签

    success 提示块标签

    info 提示块标签

    warning 提示块标签

    danger 提示块标签

    5. no-icon样式

    默认 提示块标签

    default 提示块标签

    primary 提示块标签

    success 提示块标签

    info 提示块标签

    warning 提示块标签

    danger 提示块标签

    ## 上标标签 tip

    default

    info

    success

    error

    warning

    bolt

    ban

    home

    sync

    cogs

    key

    bell

    自定义font awesome图标

    ## 动态标签 anima 1. On DOM load(当页面加载时显示动画)

    warning

    ban

    2. 调整动画速度

    warning

    ban

    3. On hover(当鼠标悬停时显示动画)

    warning

    ban

    4. On parent hover(当鼠标悬停在父级元素时显示动画)

    warning

    ban

    ## 复选列表 checkbox

    纯文本测试

    支持简单的 markdown 语法

    支持自定义颜色

    绿色 + 默认选中

    黄色 + 默认选中

    青色 + 默认选中

    蓝色 + 默认选中

    增加

    减少

    ## 单选列表 radio

    纯文本测试

    支持简单的 markdown 语法

    支持自定义颜色

    绿色

    黄色

    青色

    蓝色

    ## 时间轴 timeline

    时间轴样式

    2020-07-24 2.6.6 -> 3.0

    1. 如果有 hexo-lazyload-image 插件,需要删除并重新安装最新版本,设置 lazyload.isSPA: true
    2. 2.x 版本的 css 和 js 不适用于 3.x 版本,如果使用了 use_cdn: true 则需要删除。
    3. 2.x 版本的 fancybox 标签在 3.x 版本中被重命名为 gallery 。
    4. 2.x 版本的置顶 top: true 改为了 pin: true,并且同样适用于 layout: page 的页面。
    5. 如果使用了 hexo-offline 插件,建议卸载,3.0 版本默认开启了 pjax 服务。

    2020-05-15 2.6.3 -> 2.6.6

    不需要额外处理。

    2020-04-20 2.6.2 -> 2.6.3

    1. 全局搜索 seotitle 并替换为 seo_title
    2. group 组件的索引规则有变,使用 group 组件的文章内,group: group_name 对应的组件名必须是 group_name
    3. group 组件的列表名优先显示文章的 short_title 其次是 title
    ## 链接卡片 link ## 按钮 btns 1. 如果需要显示类似「团队成员」之类的一组含有头像的链接: 2. 或者含有图标的按钮: 3. 圆形图标 + 标题 + 描述 + 图片 + 网格5列 + 居中 ## github卡片 ghcard 1. 用户信息卡片 | | | | -- | -- | | | | | | | | | | 2. 仓库信息卡片 | | | | -- | -- | | | | | | | | | | ## github徽标 ghbdage 1. 基本参数,定义徽标左右文字和图标 2. 信息参数,定义徽标右侧内容背景色,指向链接 //如果是跨顺序省略可选参数,仍然需要写个逗号,用作分割 3. 拓展参数,支持shields的API的全部参数内容 //如果是跨顺序省略可选参数组,仍然需要写双竖线||用作分割 ## 网站卡片 sites ## 行内图片 inlineimage 这是 一段话。 这又是 一段话。 ## 音频 audio
    ## 视频 video ## 相册 gallery ## 折叠框 folding
    查看图片测试

    查看默认打开的折叠框

    这是一个默认打开的折叠框。

    查看代码测试

    假装这里有代码块(代码块没法嵌套代码块)

    查看列表测试
    • haha
    • hehe
    查看嵌套测试
    查看嵌套测试2
    查看嵌套测试3

    hahaha

    ## 分栏 tab

    tab名字为第一个Tab

    只有图标 没有Tab名字

    名字+icon

    ## 数据集合 issues ## 诗词标签 poem
    水调歌头
    苏轼

    丙辰中秋,欢饮达旦,大醉,作此篇,兼怀子由。
    明月几时有?把酒问青天。
    不知天上宫阙,今夕是何年?
    我欲乘风归去,又恐琼楼玉宇,高处不胜寒。
    起舞弄清影,何似在人间?

    转朱阁,低绮户,照无眠。
    不应有恨,何事长向别时圆?
    人有悲欢离合,月有阴晴圆缺,此事古难全。
    但愿人长久,千里共婵娟。

特效标签wow

进度条 progress

进度条样式预览

进度条样式预览

进度条样式预览

进度条样式预览

进度条样式预览

进度条样式预览

气泡注释 bubble

最近我学到了不少新玩意儿(虽然对很多大佬来说这些已经是旧技术了),比如CSS的兄弟相邻选择器例如 h1 + p {margin-top:50px;}flex布局Flex 是 Flexible Box 的缩写,意为弹性布局",用来为盒状模型提供最大的灵活性"transform变换transform 属性向元素应用 2D 或 3D 转换。该属性允许我们对元素进行旋转、缩放、移动或倾斜。,animation的贝塞尔速度曲线贝塞尔曲线(Bézier curve),又称贝兹曲线或贝济埃曲线,是应用于二维图形应用程序的数学曲线。一般的矢量图形软件通过它来精确画出曲线,贝兹曲线由线段与节点组成,节点是可拖动的支点,线段像可伸缩的皮筋写法,还有今天刚看到的clip-pathclip-path属性使用裁剪方式创建元素的可显示区域。区域内的部分显示,区域外的隐藏。属性。这些对我来说很新颖的概念狠狠的冲击着我以前积累起来的设计思路。

引用文献 reference

Akilarの糖果屋(akilar.top)是一个私人性质的博客[1]Akilarの糖果屋群聊简介参考资料,从各类教程至生活点滴,无话不谈。建群的目的是提供一个闲聊的场所。博客采用Hexo框架[2]Hexo中文文档参考资料,Butterfly主题[3]Butterfly 安装文档(一) 快速开始参考资料

本项目参考了Volantis[4]hexo-theme-volantis 标签插件参考资料的标签样式。引入[tag].js,并针对butterfly主题修改了相应的[tag].styl。在此鸣谢Volantis主题众开发者。
主要参考内容包括各个volantis的内置标签插件文档[5]Volantis文档:内置标签插件参考资料
Butterfly主题的各个衍生魔改[6]Butterfly 安装文档:标签外挂(Tag Plugins参考资料[7]小弋の生活馆全样式预览参考资料[8]l-lin-font-awesome-animation参考资料[9]小康的butterfly主题使用文档参考资料