vue富文本编辑器效果代码

代码语言:html

所属分类:表单美化

代码描述:vue富文本编辑器效果代码

代码标签: 编辑器 效果

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

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>vue html5 editor demo</title>
    <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport" />
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/vue.2.2.min.js"></script>
    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/vue-html5-editor.js"></script>

    <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/font-awesome-4.7.0/css/font-awesome.min.css">
    <style>
        #app {
            margin: 50px auto;
            width: 800px;
            max-width: 100%;
        }
    </style>
</head>
<body>
    <div id="app">
        <p>
            <button type="button" @click="focus">focus</button>
            <button type="button" @click="fullScreen">full screen</button>
            <button type="button" @click="showModuleName=!showModuleName">toggle module name</button>
            <button type="button" @click="reset">change content</button>
            <span style="white-space: nowrap">content length : {{content.length}}<.........完整代码请登录后点击上方下载按钮下载查看

网友评论0