写一个html在线测试工具_iframe在线测试-CSDN博客

本文链接：https://blog.csdn.net/chenxiong103/article/details/104236644

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>iCode</title>
<!-- reset -->
<link rel="stylesheet" href="//e945.net/skin/index/css/reset.css?v=180722">

<!-- vue -->
<script src="//cdn.bootcss.com/vue/2.6.10/vue.min.js"></script>
<!-- axios -->
<script src="//cdn.staticfile.org/vue-resource/1.5.1/vue-resource.min.js"></script>

<!-- jQuery -->
<script src="//cdn.bootcss.com/jquery/2.2.4/jquery.min.js"></script>

<!-- CodeMirror -->
<script src='//cdn.bootcss.com/codemirror/5.38.0/codemirror.min.js'></script>
<script src='//cdn.bootcss.com/codemirror/5.38.0/mode/clike/clike.min.js'></script>
<link rel="stylesheet" href="//cdn.bootcss.com/codemirror/5.38.0/codemirror.min.css">
<!-- <link rel="stylesheet" href="//cdn.bootcss.com/codemirror/5.38.0/theme/base16-dark.min.css"> -->
<link href="//cdn.bootcss.com/codemirror/5.48.4/theme/idea.min.css" rel="stylesheet">

<!-- iView -->
<link href="//cdn.bootcss.com/iview/3.5.1/styles/iview.css" rel="stylesheet">
<script src="//cdn.bootcss.com/iview/3.5.1/iview.min.js"></script>


<style>
	/* tips */
    .top,.bottom{
   
   
        text-align: center;
    }
    .center{
   
   
        width: 300px;
        margin: 10px auto;
        overflow: hidden;
    }
    .center-left{
   
   
        float: left;
    }
    .center-right{
   
   
        float: right;
    }

	.fr{
   
   float: right;}
	input{
   
   height: 32px; border: #ddd solid 1px; border-radius: 4px; padding-left: 8px; font-size: 14px;}

	/* 操作 */
	.layout{
   
   height: 64px; font-size: 16px; line-height: 64px;}
	.layout ul{
   
   list-style: none; margin-left: 20px;}
	.layout ul li{
   
   float: left; margin-right: 18px; cursor: pointer;}
	.layout ul li:hover{
   
   color: #76d17f;}
	.layout ul li i{
   
   font-size: 18px; padding-right: 4px;}

	/* 面板分割 */
	.demo-split {
   
   
	    height: 950px;
	    border: 1px solid #dcdee2;
	}

	.demo-split-pane{
   
   font