Markdown组件改变字体大小

实现Markdown组件改变右边预览字体

核心代码 :fontSize="LeftFontSize + 'px'"

:表示双向绑定值

这是我们使用的组件 mavon-editor
<mavon-editor v-model="content"ref="md":fontSize="LeftFontSize + 'px'"@imgAdd="$imgAdd"@imgDel="$imgDel"@change="change"style="min-height: 600px; fontSize: 30px; fontsize: 30px":toolbars="markdownOption"></mavon-editor>

绑定之后js函数中就十分简单了

// 修改左边字体大小resizeFontLeft(cmd){/*** cmd == 1 增加字体大小* cmd == 0 减小字体大小*/if(cmd == 1){this.LeftFontSize ++ ;}else{this.LeftFontSize -- ;}},

因为这里的字体大小是在style中定义的，我是在js的函数中拿不到，因此我之前想的是在js中赋初始值30px后，再进行操作，但是这样就会导致，我只能更改一次，不管是增加还是减小字体大小

只能修改一次的代码

/// 修改右边字体的大小resizeFontRight1(cmd){/*** cmd == 1 增加字体大小* cmd == 0 减小字体大小*/var size = 30 ;// 默认字体大小为 30 px// 右边 是 p 数组的2，第三个var tagP =   document.getElementsByTagName("p");console.log(tagP[2]);tagP[2].setAttribute("id","right");// 这个其实只要执行一次即可其实这里我之所以要设置这个id就是因为，如果我光靠class去拿fontSize属性，这个属性是 " " 空的 而且是字符串形式，就一直难以操作。然后在百度中搜索一番，基本上都是用的id，就想着想这边靠就去查能不能改，结果还真的可以 用 setAttribute document.getElementById("right").style.fontSize = size + 'px';// 设定初始值if(cmd == 1){if(size <= 60){ // 最大字体为60pxsize += 1;}}else{if(size >= 30){ // 最小字体为30pxsize -= 1 ; }}document.getElementById("right").style.fontSize = size + 'px' ;// 修改字体大小console.log(document.getElementById("right").style.fontSize);},

Markdown组件改变字体大小相关推荐

VUE中动态改变字体大小
VUE中动态改变字体大小父组件将自己的数据传递送给子组件展示,子组件监听click操作,emit发送出去,父组件监听通过emit发送的信息,改变控制字体大小的postFontSize,通过style ...
在eclipse中，怎么改变字体大小？
在eclipse中,怎么改变字体大小? 菜单栏里面点Window->Preference->General->Appearance->Colors and Fonts,再在右边 ...
MathType使用技巧之改变字体大小
MathType使用技巧之改变字体大小一.MathType中的公式字体 MathType中默认的字体大小为12pt,在word中即小四.word字体对应MathType的字体大小如下表所示. wo ...
改变文字颜色html,html怎么改变字体大小和颜色
font-family:'Microsoft YaHei'. 小编的个性取决于小编是谁,小编的态度要看看你是谁. 网页字体样式华文黑体:STHeiti 网页字体样式华文楷体:STKaiti 好的饰品是 ...
rem 用户改变字体大小_用户可以更改字体大小
rem 用户改变字体大小作者克里斯·科耶尔最近更新时间 2018年6月25日翻译自: https://css-tricks.com/users-do-change-font-size/ rem ...
最简单的改变字体大小代码
<html><head><meta http-equiv="Content-Type" content="text/html; charse ...
html字体字号颜色怎么设置,html字体样式大全 html怎么改变字体大小和颜色
网页字体样式华文黑体:STHeiti 网页字体样式华文楷体:STKaiti 网页字体样式华文宋体:STSong 网页字体样式华文仿宋:STFangsong 网页字体样式黑体:SimHei 网页字体样式 ...
php的样式怎么设置字体大小,css中如何改变字体大小
在css中,可以使用font-size属性来改变字体大小,该属性可以设置字体大小,语法格式为"font-size:值;".实际上font-size属性设置的是字体中字符框的高度,实 ...
Vivado2016如何改变字体大小
Vivado安装之后,默认字体总是很小,看起来很费眼睛.后来找到了改变字体大小的方式,如下图(以2016版本为例): 首先打开Tools,选择Options: 然后选择Text Editor中的Fon ...

Markdown组件改变字体大小

实现Markdown组件改变右边预览字体

只能修改一次的代码

Markdown组件改变字体大小相关推荐

最新文章

热门文章

Markdown组件 改变字体大小

实现Markdown组件 改变右边预览字体

只能修改一次的代码

Markdown组件 改变字体大小相关推荐

最新文章

热门文章

Markdown组件改变字体大小

实现Markdown组件改变右边预览字体

Markdown组件改变字体大小相关推荐