如何显示code样本在网页与漂亮的语法造型像堆栈溢出呢? [英] How do I Display Code Samples On Web Pages With Nice Syntax Styling Like Stack Overflow Does?

查看:163
本文介绍了如何显示code样本在网页与漂亮的语法造型像堆栈溢出呢?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我希望能拉一些code样品从数据库中和/或嵌入到网站的文本,然后在一个code一样在屏幕上的方式格式化的样本。虽然仅在屏幕上的文字是伟大的,格式将使其更加人性化。如何做到这一点?

我想这样的:搜索结果
 公共字符串MyString的=示例文本;



的样子:

 公共字符串MyString的=示例文本;



使用答案结果编辑
我把<一个href=\"http://stackoverflow.com/questions/749209/display-$c$c-samples-on-web-like-stackoverflow/749229#749229\">Gortok's建议,并看着 prettify.js 及其在做这正是我所希望的。下面是这是如何实现的。

 &LT;头=服务器&GT;
    &LT;脚本SRC =脚本/ prettify.js类型=文/ JavaScript的&GT;&LT; / SCRIPT&GT;
    &LT;脚本SRC =脚本/ jQuery的-1.3.2.js类型=文/ JavaScript的&GT;&LT; / SCRIPT&GT;
    &LT;链接HREF =脚本/ prettify.css的rel =stylesheet属性类型=文/ CSS&GT;&LT; /链接&GT;
&LT; /头&GT;
&LT;身体GT;
    &LT; code类=prettyprint&GT;
        公共字符串HelloString =新建字符串;
    &LT; / code&GT;
    &LT; SCRIPT LANGUAGE =JavaScript的&GT;
        $()。就绪(函数(){
            prettyPrint();
        });
    &LT; / SCRIPT&GT;
&LT; /身体GT;


解决方案

堆栈溢出使用的 prettify.js 来自谷歌。

I would like to be able to pull some code samples out of a database and/or have the text embedded into the website and then have the sample formatted in a code like fashion on the screen. While the text alone on the screen is great, the format will make it more user friendly. How is this done?

I want this:

 public string MyString = "The Sample Text";


To look like:

public string MyString = "The Sample Text";


EDIT WITH ANSWER
I took Gortok's suggestion and looked into Prettify.js and its doing just what I had hoped. Here is how this is implemented.

<head runat="server">
    <script src="Scripts/prettify.js" type="text/javascript"></script>
    <script src="Scripts/jquery-1.3.2.js" type="text/javascript"></script>
    <link href="Scripts/prettify.css" rel="stylesheet" type="text/css"></link>
</head>
<body>
    <code class="prettyprint"> 
        public String HelloString = "New String"; 
    </code>  
    <script language="javascript"> 
        $().ready(function() { 
            prettyPrint(); 
        }); 
    </script> 
</body>

解决方案

Stack Overflow uses prettify.js from Google.

这篇关于如何显示code样本在网页与漂亮的语法造型像堆栈溢出呢?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆