css知识--pre标签

pre标签

• 自动折行：white-space: pre-wrap;

• 代码主题：prism.js

  • 导入prism.js

    <link href="prism.css" rel="stylesheet" />
    <script src="prism.js"></script>

  • 使用该主题：

    <pre><code class='language-html'>code area</code></pre>

  • 显示行号：

    <pre><code class='language-html line-numbers'>code area</code></pre>

• 控制tab的长度：

  pre{
    tab-width：4；
  }

• 代码框自适应：

  pre:hover,pre:focus{  width: min-content;}

作者：AlleyneAdemia
链接：https://www.jianshu.com/p/dbd7a1e31224