0

在 Safari 和 Chrome 或 Firefox 上打开以下内容。

https://prismjs.com/plugins/data-uri-highlight/

现在在代码示例上向右/向左滚动。你注意到了吗？有点拖累？那是什么？

它是prismjs的东西吗？我的意思是，我应该在哪里更改某些内容以在 Safari 上具有与在 Chrome/Firefox 上相同的行为？

这是我所做的：

（我正在尝试制作源代码可视化工具。类似于https://softwarerecs.stackexchange.com/questions/50866/view-multiple-pdf-side-by-side。我以前没有见过类似的东西，有吗？特点：1. 水平滚动的多个文件的并排可视化。2. 每个文件独立的仅垂直滚动。）

在此处输入图像描述

index.html

<!DOCTYPE html>
<html>
<head>
<title>Welcome to nginx!</title>
    <link href="style.css" rel="stylesheet" />
    <link href="themes/prism.css" rel="stylesheet" />
</head>

<body>
    <script src="prism.js"></script>

<div id="content">

  <div id="left">
    <pre class="line-numbers" data-src="main.cpp"></pre>
  </div>

  <div id="right">
    <pre class="line-numbers" data-src="main.cpp"></pre>
  </div>

</div>

</body>
</html>

style.css

#content, html, body {
    height: 100%;
    white-space: nowrap;
}
#left {
    display: inline-block;
    width: intrinsic;
    background: black;
    height: 100%;
    overflow: scroll;
}
#right {
    display: inline-block;
    width: intrinsic;
    background: black;
    height: 100%;
    overflow: scroll;
}

宽度取决于内容（即main.cpp）。

4

0 回答 0