UEditor使用技巧(2):自定义样式

(1)改变内容框的样式

1.改变字体大小和颜色:内容框默认是白色背景,最近要做Web版的PS,模拟CMD命令窗口或者ISE命令窗口的背景色,分别:是黑色背景+白色字,蓝色背景+白色字
通过谷歌浏览器可以查到内容框是由JS生成的一段HTML片段,这个JS名称是 : ueditor.all.js。在这个JS内找到它生成的html代码片段.view{padding:0;word-wrap:break-word;cursor:text;height:90%;},按你需要,改这个样式即可

2.改变背景色 自定义一个css文件,输入一下css代码:
/*内容框高度*/
.edui-default .edui-editor-iframeholder {
     height: 200px;
     background-color:#000066;
 }

将它放在使用UEditor工具的页面中

效果如下:


-------------------------------------------------------------------------------------------------------------------------------------------------------------------

(2)改变工具栏按钮的样式

一般情况,下面这些工具工具是靠左浮动的,有个工具比较特殊,就是“满屏”工具按钮,它靠右浮动

可以在 ueditor\themes\default\css\ueditor.css 找到下面css代码
.edui-default .edui-toolbar .edui-for-fullscreen {
    float: right;/*改为left即可*/
}


  • 1
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值