mavonEditor配色方案效果

最新推荐文章于 2025-04-26 14:29:07 发布
最新推荐文章于 2025-04-26 14:29:07 发布
阅读量4.7k 收藏
点赞数 1
分类专栏： 前端 文章标签： mavonEditor
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_40663357/article/details/100067521
版权
本文分享了在MavonEditor中应用highlight.js的atelier-lakeside-dark配色方案的实际效果，以及与官方文档描述可能存在的差异。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

mavonEditor官方文档中只给了一个配色方案的字符串在那，并没有效果图

去highlight.js的官网看看：highlight.js

但是具体使用的时候，会与官方的有一些偏差。

我这里选用的样式是：atelier-lakeside-dark

效果如下：
在这里插入图片描述

『VUE』引入Markdown编辑器mavonEditor的引入和二次开发 获取html代码和markdown代码 自定义工具栏按钮 上传图片 导入本地markdown文件 （详细图文注释）
MZH
04-26 1703
toolbars中的每一行代表一个工具栏按钮,你可以删掉不需要的工具栏按钮bold: true, // 粗体italic: true, // 斜体header: true, // 标题underline: true, // 下划线strikethrough: true, // 中划线mark: true, // 标记superscript: true, // 上角标subscript: true, // 下角标quote: true, // 引用ol: true, // 有序列表。
mavonEditor：mavonEditor-基于Vue的markdown编辑器，支持多种个性化功能
02-03
mavonEditor：mavonEditor-基于Vue的markdown编辑器，支持多种个性化功能
mavonEditor 修改预览背景颜色、去除边框和阴影
小道仙的后宫
08-25 4691
mavonEditor 默认背景是灰色，这可能在展示给用户的时候不太友好。 mavonEditor 的官方文档写的很清楚，所以用法跟简单。 这里说一下去除的是预览模式下的背景和边框 1、去除背景阴影 :boxShadow="false" 2、去除背景色，和边框 2-1：我这里是用nuxt做演示，思路是写个全局css覆盖它的样式就好了 ...
vue集成mavon-editor编辑器，并且将图片上传到阿里云oss对象储存空间
最新发布
m0_67851662的博客
04-26 452
本文介绍在 Vue 项目中集成 mavon-editor 编辑器，并实现图片上传至阿里云 OSS 的方法。通过 npm 安装和配置编辑器，自定义图片上传逻辑，获取阿里云 OSS 临时凭证并完成上传。此教程助力开发者为 Vue 应用快速添加强大的 Markdown 编辑功能。
Markdown 语法 - 更改字体颜色大小
weixin_44352521的博客
02-28 448
<font 更改语法> 这里写你的内容 </font> # 更改语法有: color=#0099ff # 更改字体颜色 face="黑体" # 更改字体 size=7 # 更改字体大小 十六进制颜色表： # 颜色名 十六进制颜色值 颜色 AliceBlue #F0F8FF rgb(240, 248, 255) AntiqueWhite #FAEBD7 rgb(250, 235, 215) Aqua #00FFFF rg
Vue进阶（幺幺肆）：Markdown 编辑器设置字体大小颜色_mavon-editor字体颜色
2401_86358875的博客
09-11 901
【代码】Vue进阶（幺幺肆）：Markdown 编辑器设置字体大小颜色_mavon-editor字体颜色。
mavonEditor基于vue的markdown编辑器
08-10
mavonEditor：基于 Vue 的 Markdown 编辑器，支持所见即所得编辑模式、阅读模式等
SecureCRT 配色方案.rar
04-13
首先，"SecureCRT 配色方案.doc"可能包含了一套综合性的配色设定，包括字体颜色、背景颜色、高亮颜色等，这些设定旨在提供清晰、对比度适中的显示效果，使用户在长时间使用SecureCRT时仍能保持良好的视力。...
400多套matlab绘图配色方案-othercolor配色工具包
02-09
配色方案的多样性允许用户根据不同的需求，如数据类型、图表类型或视觉效果，选择最合适的颜色组合。 这个工具包中的“othercolor”提供了400多种不同的配色方案，覆盖了各种风格和用途。每种配色方案都是一系列...
SecureCRT配色方案导入.rar
06-16
标签中的"优秀的配色方案导入"意味着这份压缩包提供的不仅仅是普通的配色，而是经过精心挑选或设计的高质量方案，可能包括了流行的色彩搭配，如暗黑模式、亮色模式或者模仿知名编辑器（如VS Code、Sublime Text）的...
Visual studio用了两年的配色方案
06-14
我个人用了两年c#的代码配色方案，背景是深色的情况下。发布于2022/06/14.应该不会过时，老套。目前还在用
management:基于vue-cli4+vue2构建的后台管理系统，包含模块化封装、按需加载、主题切换、国际化、代码分割和自动部署等功能
04-19
基于vue-cli4+vue2的后台管理系统，主要包含动态路由、主题更换、国际化、表格操作、图表展示、全屏操作、markdown和数据mock等功能。注意：本项目部分内容学习自vue-element-admin，不做具体业务的开发，仅用于工程化开发方面的实践。 演示地址： 文档地址： 技术栈 基于、和开发，技术栈主要以、、、 和为主。此外，还包含以下依赖或包： 主题修改基于 css预处理基于 国际化基于 数据mock基于和 图表展示基于echarts markdown基于mavon-editor 全屏展示基于screenfull 计数动效基于countTo 进度加载基于nprogress 版本控制基于Git 静态部署基于Github Pages和Github Action 本地使用 下载前确保本地已安装NodeJS，查看源代码推荐下载VS Code编辑器。 安装有git的话直接按如下克隆到
mavon-editor 使用
weixin_42388872的博客
01-07 1822
安装 npm install mavon-editor 具体使用 1.main.js 引用 // makDown编辑器 import mavonEditor from 'mavon-editor' import 'mavon-editor/dist/css/index.css' Vue.use(mavonEditor) 2.配置vue.config.js module.exports = { /** * You will need to set publicPath if you plan t
Vue进阶（幺幺肆）：Markdown 编辑器设置字体大小颜色
IT全栈 华强工作室
04-24 2981
  Markdown是一种可以使用普通文本编辑器编写的标记语言，通过类似HTML的标记语法，它可以使普通文本内容具有一定的格式。但是它本身是不支持修改字体、字号与颜色等功能的！   CSDN-markdown编辑器是其衍生版本，扩展了Markdown的功能（如表格、脚注、内嵌HTML等等）！对，就是内嵌HTML，接下来要讲的功能就需要使用内嵌HTML的方法来实现。...
mavon-editor 使用教程
热门推荐
chelflan's blog
08-02 1万+
mavon-editor是一款基于vue的markdown编辑器，比较适合博客系统。由于官网对于一些细节的说明不够详细，这里对这里对该编辑器的使用做一个总结。 1. 安装 2. 基本使用 3. 图片上传(含服务端) 安装 npm install mavon-editor --save 基本使用 在vue-cli构建的脚手架离得main.js可以像这样...
mavon-editor使用教程
勇敢牛牛，不怕困难！
04-07 2083
我的使用方式是将编辑器放在form表单中，这样进行增删改查的时候就可以直接将数据存到数据库，并且在回显的时候，如果是回显在markdown编辑器的预览页面，是不需要的进行渲染的。可以说markdown是我最喜欢的编辑模式了，相比富文本编辑器要好太多了。这段时间在做一个面试题网站，在实现的过程中想在vue脚手架中引入一个MarkDown的編輯器，对于一个前端小白来说属实有点困难，但是最终我还是实现了，废话不多说，先看效果！这里是我配置的预览页面的全部属性，有需要的可以自行修改。总体来说效果还是很满意的。
markdown编辑器语法——文字颜色、大小、字体与背景色的设置
hunter
10-17 2124
https://blog.csdn.net/manjianchao/article/details/53668280 CSDN的markdown编辑器是其衍生版本，扩展了Markdown的功能（如表格、脚注、内嵌HTML等等）就是内嵌HTML，接下来要讲的功能就需要使用内嵌HTML的方法来实现。 一、颜色 在markdown中采用如下方式能够控制文字的颜色： 浅红色文字：&lt;font ...
markdown编辑器创建内容带样式【Vue、mavon-editor】
qq_22841387的博客
01-05 1242
问题描述 因为我现在需要通过mavon-editor创建一个带有样式的题目，所以对这个编辑区进行了初始化 但是有问题的是，左侧的html代码太长了……我想将左侧的源代码收缩，或者只显示需要填写内容的地方 实现过程 我开始的时候大致思路有两个 所见即所得 对于特定的样式进行隐藏 因为这里的样式都是一致的，所以我想直接对用户隐藏，但是传给后端是有值的 但是后面发现这两种实现方式都有些不好实现，于是采用了渲染markdown抽成组件 单独创建组件渲染markdown 因为所有的样式都是一致的，所
vue中使用mavon-editor, 不使用cdn, 本地按需引入高亮样式
weixin_46213331的博客
04-28 1769
问题发现 我的项目中使用Nuxt.js开发，在使用mavon-editor的过程中发现，有时候外部样式文件会加载失败，如下图： 而这种情况似乎与家用网络有关，有时候成功有时候失败，而用手机流量则不会失败。 为了避免项目上线时不会导致部分用户无法使用，得采用本地引入css。 尝试解决 按照官网的说法，使用以下方式进行引入： <template> <div id="app"> <mavon-editor :subfield = "subfield"
评论 5
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值