CSS代码荧光笔 - 线

Question

之间的间距看到这个小提琴：http://jsfiddle.net/Zdnsx/

我有3个问题，

1. 为什么不工作margin-top？是因为它们是内嵌元素还是因为它们在预标签中？

2. 在预标签中使代码高亮还是有更好更简单的解决方案是一个好主意？

3. 是否有任何代码荧光笔CSS样式表？我需要CSS样式表只是因为我不知道什么JS和jQuery等

Answer 1

1. 因为他们是inline elements：

   strong { margin-top: 1em; }

   <pre><strong>hello</strong></pre>
<strong>hello</strong>

2. （和3）SyntaxHighlighter。 CSS无法选择特定的单词，因此您需要使用JavaScript或添加标签服务器端。

Answer 2

1. 没有margin-top风格。

2. 这将是有道理的，因为pre将使占空白的蝙蝠。

3. 搜索jQuery Syntax Highlighter会为您带来各种资源，其中包括用于语法突出显示的CSS文件。只要找出你需要的样式表，使用那个样式表，并忘记实际的JS。 Here's an example。

---

快速笔记，虽然。当使用语法高亮一个pre元素，你会发现，这样的：

<pre><a>Hello World!</a></pre> 

将产生：

Hello World! 

而不是

<a>Hello World!</a> 

那是因为你需要改变你的分别为<和>至<和>。