如何在博客中插入jsfiddle的代码

1、进入官网:https://jsfiddle.net/

可以看到如下界面,顶端的控制按钮包括:保存,运行,代码格式化等;

image

 

2、将html、css、js分别写在指定的位置当中,最后一个框result是显示效果的;

3、代码编辑完之后保存,会得到上面所写代码的链接,把这个链接复制下来,后面插入博客就用它

4、在博文中插入以下代码:

<iframe
  style="width: 100%; height: 300px"
  src=" https://jsfiddle.net/mxaeoaxb/embedded/result,html,css,js/">
</iframe>

效果:

其中https://jsfiddle.net/mxaeoaxb就是上面提到的代码链接,result,js,html,css指的是排列顺序

可参考网站:http://doc.jsfiddle.net/

posted on 2016-11-21 09:34  洛水三千  阅读(1584)  评论(2编辑  收藏  举报

导航