引言

</article>
[toc]

Theme Showcase

Heading (h2)

h3

h4

h5
h6

Image (click to zoom in/out)

1
2
3
<!-- new line -->
![space](https://.../nh-pluto-moonlight.jpg)
<!-- new line -->

space

Inline image

Not bad.yes

  • Travis CI build status: build-img
  • Lastest release: release-img
  • License: license-img

hr

Below is a hr, I guess.

Above is a hr, I guess.

List

Unordered list

  • list item
  • list item
    • list item
    • list item
      • list item
      • list item
  • list item

Ordered list

  1. list item
  2. list item
    1. list item
    2. list item
      1. list item
      2. list item
  3. list item

ChecklistA

  • [ ] Get up at 7:00 AM
  • [ ] Eat breakfast
  • [ ] Go to bet before 11:00 PM

Table

Hear no evil Speak no evil See no evil
🙉 🙊 🙈

Text align

Hear no evil Speak no evil See no evil
🙉 🙊 🙈

Headless

1
2
3
&nbsp; | &nbsp; | &nbsp;
:-----:|:------:|:-:
A      | B      | 🙈
A B 🙈

Long table

Sun With Face Grinning Face Smiling Face Grinning Face With Big Eyes Smiling Face With Smiling Eyes Full Moon Face Grinning Face With Smiling Eyes Face With Monocle Cowboy Hat Face Thinking Face Face Vomiting
🌞 😀 ☺️ 😃 😊 🌝 😄 🧐 🤠 🤔 🤮

Blockquote

(https://hexo.io/docs/tag-plugins#Block-Quote)

Every interaction is both precious and an opportunity to delight.

Seth GodinWelcome to Island Marketing

NEW: DevDocs now comes with syntax highlighting. http://devdocs.io

@DevDocstwitter.com/devdocs/status/356095192085962752

Code Block

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
class Utils {
  animate(element: Element, attr: string, change: { from: number, to: number, duration?: number }, onEnd?: () => void) {
    if (change.from = = change.to) return;

    if (!change.duration)
      element[attr] = change.to;

    const easing = (t, b, c, d) => c * ((t = t / d - 1) * t * t + 1) + b,
      { from, to } = change,
      during = Math.ceil((change.duration || 300) / 17) || 1;

    let start = 0,
      instance = null;

    step();

    function step() {
      const value = Math.ceil(easing(start, from, to - from, during));

      start++;
      if (start <= during) {
        element[attr] = value;
        instance = requestAnimationFrame(step);
      }
      else {
        if (onEnd) onEnd();
        cancelAnimationFrame(instance);
      }
    }
  }
}

With caption

(https://hexo.io/docs/tag-plugins#Code-Block)

1
2
_.compactUnderscore.js_.compact([0, 1, false, 2, '', 3]);
// [1, 2, 3]

Gist

(https://hexo.io/docs/tag-plugins#Gist)

JSFiddle

(https://hexo.io/docs/tag-plugins#jsFiddle)

script

1
2
3
4
5
6
7
8
9
stars: <span id="stargazers_count"></span>

<script>
fetch('https://api.github.com/repos/ikeq/hexo-theme-inside')
  .then(res => res.json())
  .then(json => {
    document.getElementById('stargazers_count').innerHTML = json.stargazers_count || json.message;
  });
</script>

stars: 362

For the lastest ES grammar and code minification.
Run the following command in the root cover of Hexo (not themes/inside):

1
npm install babel-core babel-preset-env html-minifier terser --save

Canvas

Syntax：

1
2
3
4
{% canvas [width] [height] %}
ctx.fillStyle = 'red';
ctx.fillRect(0, 0, w, h);
{% endcanvas %}

width is default to 300, height is default to 150，also the following constants are available in the scope:

constant
ctx CanvasRenderingContext2D
w Canvas width
h Canvas height

For example:

1
2
3
4
5
6
{% canvas 100 100 %}
const r = w / 2;
ctx.fillStyle = 'antiquewhite';
ctx.arc(r, r, r, 0, Math.PI * 2);
ctx.fill();
{% endcanvas %}

MathJax (SSR)

When $a^2+b^2=c^2$, there are two solutions to and they are

Code Color

1
2
3
4
init i=1
 if i=0{
   then i++
 }
头像头像
萨雷斯煜
To be better
原创Theme Showcase
本博客所有文章除特别声明外，均采用 CC BY-NC-SA 4.0 许可协议。转载请注明来自 HANRY！
产品4
喜欢这篇文章的人也看了
评论
匿名评论隐私政策