前言

从写博客主题至今，对于代码高亮的行号，一直是比较头疼的，以前初学前端的时候，有过一些尝试，比如利用代码里面的行高是固定的，然后创建一个伪元素，伪元素的内容就是一行一个数字，然后通过脚本生成一个9999行的内容，然后伪元素父容器再做个内容溢出剪切，实现了一个代码行号的处理。

最近博客主题评论下有人想要增加代码行号，我记得之前掘金是没有代码行号的，最近打开发现有了，于是就想办法给研究出来了。

于是就有了这篇教程，方法也很简单。

其实这个行号甚至与highlight.js关系不大，只是作为一个关联关系，可以用其他的同类竞品替代。

教程

此处内容已隐藏回复后方可阅读。

分类： Typecho博客教程 标签： typecho代码高亮highlight.js代码行号
版权申明

本文系作者 @木灵鱼儿 原创发布在木灵鱼儿站点。未经许可，禁止转载。

评论

全部评论 13

  1. ＜Six
    ＜Six
    Google Chrome Windows 10
    膜拜一下大佬
    回复
    1. 木灵鱼儿
      木灵鱼儿
      FireFox Windows 10
      @＜Six[热词系列_肥肠自信]
      回复
  2. test
    test
    Google Chrome Android
    发下消息看看
    回复
  3. X8X
    X8X
    Google Chrome Windows 10
    我悄悄的来看看！
    回复
  4. ewrwer
    ewrwer
    Google Chrome Windows 10
    让我来悄悄看
    回复
  5. xxx
    xxx
    Google Chrome Windows 10
    让我来悄悄看
    回复
  6. 萧六
    萧六
    Google Chrome Windows 10
    让我来悄悄看
    回复
  7. Ryan
    Ryan
    FireFox Windows 10
    狗花整得这么神秘干嘛
    回复
    1. 木灵鱼儿
      木灵鱼儿
      FireFox Windows 10
      @Ryan防止被CSDN偷啊
      回复
      1. Ryan
        Ryan
        FireFox Windows 10
        @木灵鱼儿有道理，就是为啥限制5个字
        回复
        1. 木灵鱼儿
          木灵鱼儿
          FireFox Windows 10
          @Ryan[辣眼睛]这样评论内容会好看点
          回复
  8. 鲁迅
    鲁迅
    Google Chrome Windows 10
    让我也瞧瞧
    回复
  9. 泽泽
    泽泽
    Safari iPhone
    让我康康怎么弄的
    回复

相关推荐

Typecho掘金编辑器《Typecho_Plugin_JJEditor》

木灵鱼儿 1838 1 11
插件 编辑器 typecho

Typecho 实现一个目录树

木灵鱼儿 3001 100 18
typecho 目录树

开源主题-高仿掘金《JJ》V2.0

木灵鱼儿 36007 516 124
typecho 开源 博客主题

typecho 自定义分类和分类高亮处理

木灵鱼儿 2567 0 14
主题 typecho 分类

利用typescript实现原生css变量的主题切换功能类

木灵鱼儿 1082 0 0
typecho TypeScript 主题切换

typecho主题开发：基于webpack5的多页面打包项目

木灵鱼儿 2226 0 6
typecho 主题开发 webpack5

让typecho支持特殊字符

木灵鱼儿 1235 0 0
typecho 特殊字符 emoji

typecho 真的很简单的自定义评论列表

木灵鱼儿 33392 0 92
typecho 评论 自定义评论

Lay 响应式Typecho博客主题 V1.1.2

木灵鱼儿 13466 0 8
主题 typecho 博客主题

如何构建一个可交互的组件文档

木灵鱼儿 2702 0 0
vue 交互文档 raw-loader
获得点赞 9
文章被阅读 829
最后更新 24-04-01 16:55:58

目录

目录