SyntaxHighlighter.js是一个代码高亮的JS插件,使用也很简单,但是由于是浏览器段执行JS代码来着色,会出现视觉上闪一下的效果。比如你的20行代码网页打开显示高度为100px,但是SyntaxHighlighter高亮后该区域高度变为120px 加上颜色的变化,这样的体验特别不好。

解决原理:把pre标签的样式定义为 高亮后的样式即可

解决方法:在shCoreDefault.css文件加上如下样式

pre {
line-height:22px !important;
background-color:#f5f5f5!important;
border:1px solid #ccc!important;
border-radius:4px!important;
width:98% !important;
margin:.3em 0 .3em 0!important;
padding:0 0 0 1em!important;
font-size:13px !important;
font-family:Monaco,Menlo,Consolas,"Courier New",monospace;
}

  即可这样就不会出现大面积的闪烁了,然后按F5强制刷新浏览器缓存,查看效果,如果还是有细微差距,可以自己微调CSS样式。

原文引用:http://www.itxst.com/detail/d8459385.html

防止SyntaxHighlighter.js的闪烁闪一下的方法的更多相关文章

  1. 利用JS实现闪烁字体

    以下为在JSP文件中,利用JS实现闪烁字体的代码: HTML代码: <div id="blink">一段会闪烁的字</div> JavaScript代码: ...

  2. js jquery 页面加载初始化方法

    js jquery 页面加载初始化方法 一.js页面加载初始化方法 // 1.在body里面写初始化方法. <body onload='init()'> </body> < ...

  3. JS清除IE浏览器缓存的方法

    js中自动清除ie缓存方法 — 常用 对于动态文件,比如 index.asp?id=... 或者 index.aspx?id=... 相信有经验的程序员都知道怎样禁止浏览器缓存数据了.但是对于静态文件 ...

  4. JS按回车键实现登录的方法

    本文实例讲述了JS按回车键实现登录的方法,该功能有着非常广泛的实用价值.分享给大家供大家参考之用.具体方法如下: 方法一: ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 < ...

  5. 编写高质量JS代码的68个有效方法(八)

    [20141227]编写高质量JS代码的68个有效方法(八) *:first-child { margin-top: 0 !important; } body>*:last-child { ma ...

  6. 编写高质量JS代码的68个有效方法(七)

    [20141220]编写高质量JS代码的68个有效方法(七) *:first-child { margin-top: 0 !important; } body>*:last-child { ma ...

  7. 编写高质量JS代码的68个有效方法(六)

    [20141213]编写高质量JS代码的68个有效方法(六) *:first-child { margin-top: 0 !important; } body>*:last-child { ma ...

  8. 编写高质量JS代码的68个有效方法(四)

    [20141129]编写高质量JS代码的68个有效方法(四) *:first-child { margin-top: 0 !important; } body>*:last-child { ma ...

  9. 编写高质量JS代码的68个有效方法(三)

    [20141030]编写高质量JS代码的68个有效方法(三) *:first-child { margin-top: 0 !important; } body>*:last-child { ma ...

随机推荐

  1. Redhat/Fedora 网络接口的配置文件和网络接口专用配置工具

    在Redhat/Fedora 中,与乙太网卡相关的配置文件位于 /etc/sysconfig/network-scripts目录中,比如 ifcfg-eth0.ifcfg-eth1 .... .... ...

  2. Django与HTML业务基本结合

    app里都有migrations文件 app: migrations 数据修改表结构,数据库操作记录 admin Django为我们提供后台管理 apps 配置当前app models ORM,写指定 ...

  3. 2018 8.8 提高A组模拟赛

    T1 Description 被污染的灰灰草原上有羊和狼.有N只动物围成一圈,每只动物是羊或狼. 该游戏从其中的一只动物开始,报出[1,K]区间的整数,若上一只动物报出的数是x,下一只动物可以报[x+ ...

  4. vim中NERDTREE插件的使用

    一个显示目录树的插件,很不错 学习于: http://blog.csdn.net/xiongzhengxiang/article/details/7375607

  5. 【Pyqt5】自定义信号简单原理(易懂版),多窗口交互,传输数据,调用方法

    PS:如果你想在2窗口调用1窗口的内部方法,或者在2窗口传递数据给1窗口数据,本片博客可以放心食用 主窗口: class MainWindow(QWidget,Ui_MainFrom): insert ...

  6. linux系统 (实验二)实验楼的课程笔记

    who am i  打印用户名和终端 终端的启动时间 whoami    打印用户名 who 命令其它常用参数 参数 说明 -a 打印能打印的全部 -d 打印死掉的进程 -m 同am i,mom li ...

  7. BZOJ 4420二重镇题解

    链接 思路借鉴了这个博客: 我们可以想到状压dp 用一个十进制数来表示状态,即第i位表示位置i处的物品等级 用f[i][j][k]表示第i天,仓库的物品等级为j,状态为k时的最大收益 但是状态数貌似很 ...

  8. jdbc知识点(连接mysql)

    jdbc连接mysql 1.JDBC简介 JDBC: 指 Java 数据库连接,是一种标准Java应用编程接口( JAVA API),用来连接 Java 编程语言和广泛的数据库.从根本上来说,JDBC ...

  9. 阿里云发布SaaS加速器,用宜搭,像搭积木一样搭应用

    宜搭让不会编码的人也能快速搭建SaaS应用,大幅提升研发效率. (图:阿里云智能产品管理部总经理马劲在2019阿里云峰会·北京现场进行宜搭应用搭建演示. ) 3月21日,在2019阿里云峰会·北京上, ...

  10. Precision和Recall

    学习自: http://blog.csdn.net/wangran51/article/details/7579100