美化本地链接不正确

Question

我在使 Google Code Prettify 正常工作时遇到问题。此示例正在运行，使用提供的远程文件：

<html>
<head>
    <title>Google Code Prettify testing</title>
    <script data-brackets-id='140' src="https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js?autoload=true&amp;skin=sunburst&amp;lang=css" defer="defer">
    </script>
</head>

<body>

<h1>Google Code Prettify testing</h1>

<pre class="prettyprint" style="font-size: 12pt;">
&lt;script type="text/javascript"&gt;
// This is a comment
var myString = "Hello, World!";
var myInt = 42;

function helloWorld(world) {
    for (var myInt; --myInt &gt;= 0;) {
        alert(myString);
    }
}
&lt;/script&gt;
&lt;style&gt;
    p { color: pink }
    b { color: blue }
    u { color: "umber" }
&lt;/style&gt;
</pre>
  
</body>
</html>

结果：

这是从 Prettify 远程托管中提取的。请注意 <script> 中的某些项目仅用于样式和行为。以下也可以正常工作：

<html>
<head>
  <title>Prettify Default Test</title>
  <script src="https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js"></script>
</head>

它仅以默认外观和行为呈现（注意这是不同的浏览器）

但是我在本地下载保存文件的时候是这样写的：

<html>
<head>
    <title>Google Code Prettify testing</title>
    <link href="google-code-prettify/src/prettify.css" type="text/css" rel="stylesheet" />
    <script type="text/javascript" src="google-code-prettify/js-modules/run_prettify.js"></script>
</head>

<body onload="prettyPrint()">

<h1>Google Code Prettify testing</h1>

<pre class="prettyprint" style="font-size: 12pt;">
&lt;script type="text/javascript"&gt;
// This is a comment
var myString = "Hello, World!";
var myInt = 42;

function helloWorld(world) {
    for (var myInt; --i &gt;= 0;) {
        alert('Hello ' + String(world));
    }
}
&lt;/script&gt;
&lt;style&gt;
p { color: pink }
b { color: blue }
u { color: "umber" }
&lt;/style&gt;
</pre>
  
</body>
</html>

然后，格式的 none 继承：

这是文件夹结构的快照。我已经验证以确保它在代码中被准确引用...

prettify.css

run_prettify.js

关于为什么会这样，您能提供一些建议吗？

Answer 1

您的格式设置不起作用的原因是您为“run_prettify.js 文件引用了错误的路径。您将所有美化文件存储在 google-code-prettify/src/ 而您试图 link 到一个不存在的文件夹，例如 js-modules.

我已经在本地对此进行了测试，使用您提供的具有相同文件夹结构的确切源来复制您的环境，并得出相同的结果，格式只呈现黑色字体。一旦我将其更改为 "google-code-prettify/src/"，它就可以正常工作。

同样，要解决此问题，请将路径更改为：

<script type="text/javascript" src="google-code-prettify/js-modules/run_prettify.js"></script>

至

<script type="text/javascript" src="google-code-prettify/src/run_prettify.js"></script>

您可能运行遇到的唯一其他问题是某些浏览器（尤其是 IE）可能会阻止某些内容在您的浏览器中显示。如果您所在的网络强制阻止某些内容显示或在显示被阻止的内容之前提示您获得许可，您可能必须 select "Show Blocked Content" 或类似的内容才能显示您喜欢的内容到.

希望对您有所帮助！

编辑：这对您来说是不必要的 - 但可能会帮助遇到类似情况的其他社区成员 - 但我想我也会参考入门部分，该部分指的是为您自己的 JS 和 CSS 文件提供服务的要求以及如何起床和运行ning.

https://code.google.com/p/google-code-prettif/wiki/GettingStarted#Serving_your_own_JS_&_CSS

美化本地链接不正确

Prettify not linking correctly locally

html

css

pretty-print

prettify.css

run_prettify.js