这篇会介绍一些基本概念，后面不会再介绍。
用过i排版的应该有看到i排版的特色样式那有一个弹幕样式，不过有的是需要VIP才可以使用，现在教一种简单的使用方法，也适用于其余样式的使用。
点击你想要的弹幕样式放入编辑器内，然后点击编辑器右上角的HTML。
你会看到上图，包含在<svg></svg>这两个标签之间的即为弹幕效果的代码。如果你只是想简单的替换文字，效果不变，那把<text></text>内的汉字改为你想要的汉字就可以了。然后在代码模式中，有装新媒体管家或者是壹伴插件的，可以通过右上角的</>或html打开代码模式，把<svg></svg>这一段代码复制到公众号图文的代码格式中，再切换回来就可以看到弹幕效果的实现了。
好了，简单的讲完，吃瓜的看到这里就可以，接下去是详细讲解每一个代码的意思，自行对照上图绿颜色标签，蓝颜色属性，红颜色属性值理解，找不到颜色那我们之间肯定有一个是色盲。
标签一般分为两个，一个是开始标签，如<svg>；一个是结束标签，比开始标签多一个“/”，表示闭合。
标签<svg>指的是画布，可以通过width和height调节画布的大小，单位有px、em、pt。
属性background是背景颜色，格式可以有十六进制颜色码或RGB格式，简单一点的可以用英文表示，如red、black、purple等。
属性box-sizing是盒模型的样式，一般可以不用设置，默认就行。
标签<text>顾名思义，文本，在标签间输入文本即会在前端展示文本。
属性x、y指的是距离左边和上边的距离，同样适用于<svg>。
属性fill在这里指的是文字颜色，颜色格式同背景颜色。
属性font指的是字体，有多种属性。font-family字体样式，如微软雅黑。font-size字体大小。font-weight字体粗细。
x、y演示
标签<animate>是SVG动画的基础，和<animateTransform>一样，只是属性效果不一样。<animate>的属性有x、y、opacity透明度、weight宽度、r半径（适用于圆形circle）、fill、stroke（描边）等，<animateTransform>的属性有translate平移、scale缩放、rotate旋转、skew倾斜。
在<animate>中，使用属性attributename确定要变换的属性，用from和to确定变换的初始值和结束值，效果会根据值线性变化，也可以使用values来填写多个值，如attributename="x",values="800;400;-400"，即图形会从x轴800的位置先变换到400处，再变换到-400处。
属性begin为效果开始的时间，可以设置为多少s，也可以设置为click点击后开始，dur为持续的时间，end则为结束的时间。
属性repeatcount为效果循环的次数，可以有数字表示循环几次，indefinite表示无限循环。如果循环设置了fill="freeze"，有限次数循环结束后，对象则会停留在最后的位置，没设置则会回到起始位置。
在<animateTransform>中，attributename的值统一为transform，是用type来确定是translate还是scale等类型。其余的begin、values等属性都和<animate>中的属性一样设置，有区别的是这里的values牵扯到坐标，如rotate的values="0 x1 y1;360 x2 y2"指的是围绕坐标从0度转到了360度。建议去了解下rect矩形、circle圆形、ellipse椭圆等来了解坐标。还有就是多个<animateTransform>效果叠加，需要有additive="sum"，效果前后不一样，最后的效果也会不一样。
讲到这里就结束了，动作快的已经直接在i排版的html格式中调整操作。
网友评论