美文网首页
MarkDown编辑器设置图片大小

MarkDown编辑器设置图片大小

作者: 放羊娃华振 | 来源:发表于2022-01-01 00:19 被阅读0次

一、概述

当集成Editor.md编辑器的时候发现不能像简书那样动态的设置图片的尺寸。但是可以做如下的修改实现在编辑过程中根据设置展示尺寸。
参考CSDN 当需要图片大小时可以如下

![图片描述](url =100x100)

而Editor.md如下

![图片描述](url)

二、修改步骤

首先找到marked.min.js这个文件
然后定位Renderer.prototype.image 这个就是生成图片html的位置,原代码如下:

Renderer.prototype.image = function(href, title, text) {
            var out = '<img src="' + href + '" alt="' + text + '"';
            if (title) {
                out += ' title="' + title + '"'
            }
            out += this.options.xhtml ? "/>" : ">";
            return out
        }

简单修改一下:

Renderer.prototype.image = function(href, title, text) {
            var array = href.split("=");
            var width;
            var height;
            if(array.length == 2){
                href = array[0];
                var resolution = array[1].split("x");
                if (resolution.length == 2){
                    width = resolution[0]
                    height = resolution[1];
                }
            }
            var out = '<img src="' + href + '" alt="' + text + '"';
            if (title) {
                out += ' title="' + title + '"'
            }
            if(width){
                out += ' width="' + width + '"'
            }
            if(height){
                out += ' height="' + height + '"'
            }
            out += this.options.xhtml ? "/>" : ">";
            return out
        };

详情参考官网:https://pandao.github.io/editor.md/examples/index.html

相关文章

  • Android自定义View,Android炫酷的音乐频谱进度条

    (因为简书的markdown编辑器无法设置图片大小,而我的文章又是从我的博客上粘贴来的,所以图片大小无法控制,如果...

  • 如何在简书上写代码文章

    1.设置为Markdown 编辑器 登录简书账号--设置--基础设置--常用设置--常用编辑器(Markdown)...

  • Markdown 新手入门

    1.设置为Markdown 编辑器 登录简书账号--设置--基础设置--常用设置--常用编辑器(Markdown)...

  • DAY1

    Markdown练习 Markdown编辑器切换 点击左下角设置-默认编辑器-Markdown编辑器即可切换,注意...

  • MarkDown编辑器设置图片大小

    一、概述 当集成Editor.md编辑器的时候发现不能像简书那样动态的设置图片的尺寸。但是可以做如下的修改实现在编...

  • Markdown使用体验1

    Markdown 的部分用法 首先,要在“写文章-->设置-->默认编辑器”中,设置为Markdown编辑器。若是...

  • markdown写作和排版

    设置-默认编辑器-Markdown编辑器 markdown的语法 标题 这是最为常用的格式,在 Markdown ...

  • Mardown---编辑模式

    简书文章编辑可以使用Markdown编辑器 -点击设置--基础设置 将常用编辑器 markdown 选中即可,...

  • 简书自带命令设置表格

    首先默认模式是不支持设置表格的, 要切换MarkDown编辑器模式 位置: 设置 → MarkDown编辑器 留意...

  • markdown学习笔记

    学markdown前,先在把简书的编辑器设置成markdown吧 “写文章”——“设置”——“默认编辑器”——“M...

网友评论

      本文标题:MarkDown编辑器设置图片大小

      本文链接:https://www.haomeiwen.com/subject/ypxoqrtx.html