quill结合markdown-it实现输入html实时转换成markdown格式代码-html代码-BFW代码库

quill结合markdown-it实现输入html实时转换成markdown格式代码

代码语言：html

所属分类：其他

代码描述：quill结合markdown-it实现输入html实时转换成markdown格式代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/quill.bubble.css">
    <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/quill.snow.css">
    <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/sakura.css">

    <style>
        #editor-container {
          height: 200px;
        }
        
        #markdown {
          background-color: #eeffee;
          min-height: 200px;
        }
        
        #html {
          background-color: #ffeeee;
          min-height: 200px;
        }
        
        #output-quill {
          background-color: #ffeeff;
          min-height: 200px;
          
          ol .ql-indent-1 {
          margin-left: 200px;
        }
        }
        
        
        
        #output-markdown {
          background-color: #ffeeff;
          min-height: 200px;
        }
    </style>



</head>

<body>
    <h1>Quill JS Editor</h1>
    <hr>
    <div id="editor-container">
    </div>

    <h1>Rendered Markdown</h1>
    <hr>
    <div id="output-markdown"></div>

    <h1>Rendered HTML</h1>
    <hr>
    <div id="output-quill"></div>

    <h1>RAW HTML</h1>
    <hr>
    <div id="html"></div>

    <h1>Markdown Code</h1>
    <hr>
    <div>
        <pre id="markdown"></pre>
    </div>

    <script type="text/ja.........完整代码请登录后点击上方下载按钮下载查看