引言

</article>
[toc]

Theme Showcase

Heading (h2)

h3

h4

h5

h6

Heading link

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

With link

Travis CI build status:
Lastest release:
License:

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

list item
list item
1. list item
2. list item
  1. list item
  2. list item
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

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

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：

{% 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:

{% 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

init i=1
 if i=0{
   then i++
 }

萨雷斯煜

To be better

原创 Theme Showcase

本博客所有文章除特别声明外，均采用 CC BY-NC-SA 4.0 许可协议。转载请注明来自 HANRY！

产品4

喜欢这篇文章的人也看了