UEditor编辑器如何设置代码高亮?

如果是一个编程或IT类网站,页面上会有大量代码,而让代码高亮显示,显示行号等,可以使页面更美观,用户体验更好。如果后台用百度编辑器(ueditor)可以使用自带的SyntaxHighlighter来实现代码高亮。

UEditor是由百度web前端研发部开发的所见即所得富文本web编辑器,是百度的一个javascript编辑器的开源项目。

UEditor 是开源、免费的在线HTML编辑器,主要用于让用户在网站上获得所见即所得编辑效果。

UEditor兼容性很好,是网站站长开发的首选,官网地址:UEditor官网 包含UEditor介绍、UEditor教程、UEditor 演示DEMO、UEditor使用帮助和UEditor下载。

UEditor编辑器自带SyntaxHighlighter,支持多种语言,效果不错,且缩进比较完美。

UEditor设置页面代码高亮步骤

1.引入css:

<link rel="stylesheet" href="/Public/widgets/SyntaxHighlighter/shCoreDefault.css" />

2.引入js文件(js较大,建议压缩且最好放到页面底部):

<script type="text/javascript" src="/Public/widgets/SyntaxHighlighter/shCore.js"></script>

3.初始化:

<script type="text/javascript">
    SyntaxHighlighter.all(); //代码高亮
</script>

上面路径请以实际路径为准。

125jz网原创文章。发布者:江山如画,转载请注明出处:http://www.125jz.com/1173.html

赞 (0)
江山如画的头像江山如画管理团队
导航特效:jquery实现当前(活动)菜单样式变化
上一篇 2018年2月8日 下午12:51
导航特效:纯css制作三级下拉导航菜单
下一篇 2018年2月9日 上午10:34

99%的人还看了以下文章

  • 单元测试工具JUnit介绍及使用,单元测试快速入门教程五

    单元测试工具JUnit介绍及使用,单元测试快速入门教程五单元测试工具JUnit介绍及使用,单元测试快速入门教程五单元测试工具JUnit介绍及使用,单元测试快速入门教程五单元测试工具JUnit介绍及使用,单元测试快速入门教程五

    JUnit是一个开放源代码的测试框架,用在编写和运行可重复的测试脚本之上,是用于Java语言编写的面向对象程序的单元测试工具。JUnit框架功能强大,目前已经成为Java单元测试的事实标准,基本上能满足日常的测试要求。 1.Junit主要特性 (1)可以将测试代码和产品代码分别开发,便于管理。 (2)针对某一个类的测试代码,以较少的改动便可以应用    另一…

    2018年4月18日 • 编程开发
    15.4K0
  • servlet中如何使用Session?

    servlet中Session的用法 使用Servlet中的request对象获取session对象并输出其属性:HttpSession session = request.getSession(); request.setCharacterEncoding(“utf-8”); response.setContentType(“text/html;chars…

    2020年4月4日
    10.6K0
  • 如何修改从Maven中心仓库下载到本地的jar包的默认存储位置?

    如何修改从Maven中心仓库下载到本地的jar包的默认存储位置?如何修改从Maven中心仓库下载到本地的jar包的默认存储位置?如何修改从Maven中心仓库下载到本地的jar包的默认存储位置?如何修改从Maven中心仓库下载到本地的jar包的默认存储位置?

    为什么要修改从Maven中心仓库下载到本地的jar包的默认存储位置? 把jar包下载到本地的好处就是,当编译时,会优先从本地的jar包去找,如果本地存在,就直接拿来用,如果不存在,就从Maven的中心仓库去下载。 第一次执行”mvn compile”和”mvn clean”这两个命令时,Maven会去中央仓库下…

    2023年1月28日 • 编程开发
    2.1K0
  • 跟永哥学MVC:jsp+javabean+servlet实现求圆的面积

    上一节课我们通过一个案例三种实现,教你理解Jsp、javabean、Servlet(精),今天我们仍然通过同一个案例求圆的面积,使用MVC:jsp+javabean+servlet来实现,深入理解MVC及Jsp、javabean、Servlet的分工和使用。 r5.jsp <form action=”servletCircle” Method=”pos…

    2018年2月22日
    11.2K0
  • 第五章 JavaBean技术

    掌握:
    JavaBean的概念及规范
    JavaBean的创建与使用
    JavaBean属性的获取及修改
    getProperty:获取bean的属性值
    setProperty:设置bean的属性值

    2018年2月22日
    13.3K0
  • Java课程设计报告-记事本源代码有流程图

    Java课程设计报告 题 目:简单记事本程序的设计年级专业:计算机科学与技术  软件工程学 号:学生姓名:指导老师: 目    录 摘要… 1 前言… 2 1需求分析… 2 1.1需求分析… 2 1.2功能设计… 3 2.概要设计… 3 2.1程序设计思路… 3 2.2程序运…

    2019年10月4日
    6.3K0

发表回复

登录后才能评论

评论列表(1条)

  • 江山如画的头像
    江山如画 2018年12月27日 下午2:26

    推荐:Enlighter – 一款功能强大的WordPress代码高亮插件
    插件下载地址:https://wordpress.org/plugins/enlighter/
    可以设置样式、默认语言、缩进、行数提示等等。
    这款插件功能强大,设置简单,使用方便,且展现的代码高亮也比较友好。