一个奇怪的样式问题, 想去掉 a 标签的下划线样式, 于是增加了以下样式

a {
    text-decoration: none;
}

也就是 text-decoration: none;, 可是却不生效, 链接的下划线还是存在, 网上找了一下原因, 最后在 Stack Overflow 一个帖子 上看到有人说如果是 wordpress 主题, 还要增加一个 box-shadow: none;, 如下:

a {
    text-decoration: none;
    box-shadow: none;
}

加完后果然行了, 也不清楚是为啥...

css 的一个问题就是, 很多特性不满足简单的可加性, 经常有各种限制或在某种条件下才生效的情况.

所以, 除非你比较系统地掌握了 css, 否则你还是会经常碰到一些问题...

之前弄了一个域名及签名的一笔画动画，但只是做了一个结果展示，背后的原理没有去介绍，这次则弄了一个详细的原理介绍，参见：

//exp.xiaogd.net/hm/demo/css/stroke-animate/sa-demo.html

这次就没有去做什么幻灯片了，感觉那种形式也有其不灵活之处，这次还是回归了传统的方式，但跟传统的博客又有所区别。

主要是增加了一些互动方面的元素，用户可以与页面进行一定的交互，比如播放动画演示，通过一些输入元素实时调整参数的值以观察效果方面的改变。我感觉这种知识介绍与交互的糅合在增进用户理解方面还是有一定优势的。

当然现在的交互还是比较简单的，如果你有更好的想法，欢迎留言！

之前看过别人用 CSS 的属性 stroke-dasharray 和 stroke-dashoffset 制作的一笔画动画，觉得挺好玩的，也就自己做了个：

//exp.xiaogd.net/hm/demo/css/stroke-animate/stroke-animation.html

总共两个动画，一个是自己的域名 xiaogd.net，另一个是自己的签名，其中 svg 中的 path 提前在 inkscape 中做好，然后复制到网页中即可。

动画的实现感兴趣的同学可以查看网页的源代码了解。

CSS 绘制三角形原理演示（动画）V4 版，具体参见以下链接：

//exp.xiaogd.net/hm/demo/css/css-border/v4/cbt_slide.html

上一个版本曾经留下两个问题，一个是在微软 edge 浏览器上，部分代码高亮增强插件工作不正常，导致整体显示完全崩溃。看了下是某个 DOM 的新增 api 在 edge 上不支持导致的。我的 edge 版本是 14，在 caniuse.com 上显示，它对这个特性的支持度是“Partial support with prefix: ms”，升级 edge 到 15 或以上版本应该可以解决，不过我也没有去尝试升级。

因为用 edge 的程序员应该并不多，这段时间以来原插件也一直没有去修正这个支持，因为整个插件追求的是极简，我估计它们也不会去支持要带前缀的特性，所以这里也不打算去解决这个问题。

另一个问题是某些子步骤不能回退或在回放过程中行为不一致，这次已经修正，所有子步骤可以回退且行为一致。

其它的一些调整：

  1. 在退回到上一张幻灯片时，保持所有已显示的子步骤为显示状态。原先的行为是回去时所有子步骤又重新隐藏，如果读者只是想回去看看之前的状态，又要重新 next 出所有的子步骤，个人觉得这个体验不是太好，而且会导致在回放过程中个别复杂的行为不一致。这个调整部分修改了 impress.js中的源码。
  2. 在部分子步骤呈现过程中使用了动态箭头的引导。我个人感觉时用户在看的过程有可能会失去焦点，因为他有时不知道下一个子步骤会在哪里呈现。当然，你也可能觉得这些是种干扰。这里主要还是想尝试下这种可能性，暂时也写得比较随意，没有将这些行为完全的脚本化。一种更好的引导方式或许是之前介绍的 product feature tour 的那种 mask and highlight 的方式。也初步看了下那种方式，跟 impress 的行为有点类似，估计无法简单整合，后面再看看吧。
  3. 其它的一些小调整及代码方面的部分优化。

就这个主题而言，这个可能是最后一个版本了，不打算再去改进了。个人感觉随着想深入的应用某些特性，impress.js 所施加的限制还是很大，方式也不够灵活。因为它本来的目的也只是用来做 presentation 的，是要结合人的演说的，这里单纯的用于一种被动的展示，受到某些限制也很正常。