疫情禁足在家,用原生的JS实现了一个HTML可视化编辑工具,页面布局基于Bootstrap。大约一个月时间,打通主要技术关卡,实现了第一版:

 

可以拖放编辑,实现了几乎所有的bootstrap预定义工具类。

设计时,尽量让其可以灵活扩展,支持多主题切换,为自定义控件预留了接口。

还可以作为bootstrap学的辅助工具,在界面上选好配置,可以把相应的class全部显示出来,所见即所得。

后期的主要实现方向:

1、增加尽量多的主题,形成一个主题库

2、结合国内微信使用状况,增加可以微信分享的H5模板

源码地址:https://github.com/vularsoft/rxeditor

演示地址:https://vular.cn/rxeditor/

一个基于Bootstrap实现的HMTL可视化编辑工具的更多相关文章

  1. 我做了一个 HTML 可视化编辑工具,有前途吗?

    疫情在家的这段时间,我做了一个 HTML 可视化编辑工具,做的时候信心满满,差不多完成了,现在反而不如以前信心足了,这玩意有用吗?代码地址: https://github.com/vularsoft/ ...

  2. 自荐RedisViewer一个有情怀的跨平台Redis可视化客户端工具

    自荐一个有情怀的跨平台Redis可视化客户端工具--RedisViewer 转载自 最美分享Coder 2019-09-17 06:31:00 介绍 在以往的文章中曾经介绍过几款Redis的可视化工具 ...

  3. 封装一个基于NLog+NLog.Mongo的日志记录工具类LogUtil

    封装一个基于NLog+NLog.Mongo的日志记录工具类LogUtil,代码比较简单,主要是把MongoTarget的配置.FileTarget的配置集成到类中,同时利用缓存依赖来判断是否需要重新创 ...

  4. 封装一个基于NLog+NLog.Mongo的日志记录工具类LogUtil,nloglogutil

    封装一个基于NLog+NLog.Mongo的日志记录工具类LogUtil,代码比较简单,主要是把MongoTarget的配置.FileTarget的配置集成到类中,同时利用缓存依赖来判断是否需要重新创 ...

  5. Go/Python/Erlang编程语言对比分析及示例 基于RabbitMQ.Client组件实现RabbitMQ可复用的 ConnectionPool(连接池) 封装一个基于NLog+NLog.Mongo的日志记录工具类LogUtil 分享基于MemoryCache(内存缓存)的缓存工具类,C# B/S 、C/S项目均可以使用!

    Go/Python/Erlang编程语言对比分析及示例   本文主要是介绍Go,从语言对比分析的角度切入.之所以选择与Python.Erlang对比,是因为做为高级语言,它们语言特性上有较大的相似性, ...

  6. 分享一个基于Bootstrap的 ACE框架 入门(MVC+EF)

    基于Bootstrap3,拥有强大的功能组件以及UI组件,基本能满足后台管理系统的需求, 而且能根据不同设备适配显示,而且还有四个主题可以切换. 简单入门,源代码下载:https://github.c ...

  7. LineCalc,一个基于Lex&Yacc的简单行计算工具

    LineCalc是基于Lex&Yacc的一个简单的行计算工具,支持常见的运算符和部分POSIX中定义于math.h中的数学函数:同时,LineCalc还提供了一个简单的错误处理模块,能检测公式 ...

  8. 一个基于POI的通用excel导入导出工具类的简单实现及使用方法

    前言: 最近PM来了一个需求,简单来说就是在录入数据时一条一条插入到系统显得非常麻烦,让我实现一个直接通过excel导入的方法一次性录入所有数据.网上关于excel导入导出的例子很多,但大多相互借鉴. ...

  9. WPF快速实现XML可视化编辑工具

    虽然最近业余时间主要都放在研究AngularJS上了,不过由于正好要帮朋友做一个生成XML的小工具,顺便又温顾了一下WPF.虽然这个时代相对于Web应用和移动App,Windows应用程序是越来越少了 ...

随机推荐

  1. Python_面试题_更新中

    Python-面试题 线上操作系统 centos py2和py3的区别 每种数据类型,列举你了解的方法 3 or 9 and 8 字符串的反转 is 和 == 的区别? git流程 v = (1) / ...

  2. Oauth2 初步

    搭建一个最简单的 Oauth2 认证服务 基于 Springboot2,在 pom.xml 中引入 Oauth2: 123456789101112 <dependency> <gro ...

  3. idea常用快捷键(对于新手不建议切换使用eclipse)

    查看方法实现:ctrl+alt+鼠标实现父类方法:ctrl+i查看方法的具体实现:ctrl+alt(鼠标再点击方法)快速导包:alt+enter格式化:Ctrl+Alt+L格式化当前行:ctrl+sh ...

  4. 看了这个Java实习生入职测试题后,幸亏我不是实习生

    看了这个Java实习生入职测试题后,幸亏我不是实习生 一个Java实习生的入职测试题,你能答对几个? 今天在某APP中看到,有实习生放出的Java实习生入职测试题.看完之后,很庆幸自己不是实习生. 本 ...

  5. 006.前端开发知识,前端基础CSS(2020-01-21)

    来源:第五天  01盒子水平居中 一.盒子中文字控制: 1.text-align: center; /*可以让盒子内容(文字 行内元素 行内块元素)居中对齐*/ 二.让盒子水平居中对齐: 方法1.ma ...

  6. ibatis in语句参数传入方法

    第一种:传入参数仅有数组        <select id="GetEmailList_Test"  resultClass="EmailInfo_"& ...

  7. golang kafka clinet 内存泄露问题处理

    go 内存泄露 新版本服务跑上一天内存占用20g,显然是内存泄露 内存泄露的问题难在定位 技术上的定位 主要靠 pprof 生成统计文件 之前写web项目 基于net/http/pprof 可以看到运 ...

  8. python3下scrapy爬虫(第六卷:利用cookie模拟登陆抓取个人中心页面)

    之前我们爬取的都是那些无需登录就要可以使用的网站但是当我们想爬取自己或他人的个人中心时就需要做登录,一般进入登录页面有两种 ,一个是独立页面登陆,另一个是弹窗,我们先不管验证码登陆的问题 ,现在试一下 ...

  9. maven 多bundle项目

    1 环境 eclipse maven jdk1.8 多bundle项目需要一个父项目(聚合模块),起到聚合其他模块的作用,其他模块的管理工具,不包含实际的代码. 新建maven项目-->Crea ...

  10. [LC] 142. Linked List Cycle II

    Given a linked list, return the node where the cycle begins. If there is no cycle, return null. To r ...