有了jsfiddle，我们就不需要边写博客贴代码边截效果图了，我们可以用它来在线编辑一些HTML,CSS,javascript片段，编辑的代码可以与其他人分享，或嵌入我们的博客等。需要写演示用的JavaScript实例代码的时候，就完全可以在jsFiddle里面直接完成编写后调试，再将结果直接嵌入Blog正文里。
工具/原料
1
电脑
2
博客
方法/步骤
2
在jsfiddle上编辑代码jsfiddle界面代码部分被分成四个区域：HTML(存放html代码)、CSS（存放css代码）、JAVASCRIPT（存放js代码）、RESULT（点击Run后显示代码运行结果）我们把代码分别放入html，css，js三个区域，点击Run运行代码，在result中查看效果。
3
在jsfiddle上调试代码如果发现所写的代码有问题，就一直调试到我们想要的效果为止，然后点击Save保存，会生成一个新网址，复制这个网址，后面插入博客就用它
4
在博文中插入jsfiddle代码在博文中需要代码演示的地方插入以下代码：其中：width、height可以根据需要来设置链接：src=' 第3步生成的网址复制到这里/embedded/result,html,css,js/ result,html,css,js 是博文中它们的排列顺序，可以跟前自身需要来调整预览在博文中的效果如下：
注意事项
在博文中插入jsfiddle代码，要在博文源代码中插入
上一篇：认识装修中常见的污染物
下一篇：橱柜细节功能大全