我想在html中显示html代码,我从SO本身尝试solution,但这没有用,或者可能是我遗漏了一些东西。然后,我尝试了以下语法,但没有帮助(只有点击此处应用)。
<pre><code><span style='font-size:20px'>Click Here to Apply </span></code></pre>
任何人都帮我弄明白,我的做法有什么不对?
答案 0 :(得分:3)
你必须替换所有'&lt;'包含<
和所有'&gt;'的字符与>
请注意,这不会提供代码着色,但这是您所寻求的。
答案 1 :(得分:2)
曾经有一个xmp
标记来支持此功能 - 此标记现已弃用,但仍受所有主流浏览器支持。
如果没有其他东西适合您的需要,您可以使用它。
<pre><xmp><span style='font-size:20px'>Click Here to Apply </span></xmp></pre>
答案 2 :(得分:2)
Tomer's answer是正确的,这就是我这样做的方式。但是有一种使用JavaScript的替代方案。您可以删除元素的HTML,然后使用createTextNode()
将其添加回文本。将元素传递给此函数:
function revealElementHTML(el) {
var html = el.innerHTML;
el.innerHTML = "";
el.appendChild(document.createTextNode(html));
}
答案 3 :(得分:0)
如果你需要着色片段, jQuery.snippet提供了一个很好的着色工具。
答案 4 :(得分:0)
您应该使用ascii字符来显示您的代码,或者您必须使用javascript作为gilly3的答案。
您可以转换您的HTML代码online。
如果您使用php,请使用htmlentities。
最后你可以使用以下css来设置它的样式。
pre {
white-space: pre-wrap; /* css-3 */
white-space: -moz-pre-wrap !important; /* Mozilla, since 1999 */
white-space: -pre-wrap; /* Opera 4-6 */
white-space: -o-pre-wrap; /* Opera 7 */
word-wrap: break-word; /* Internet Explorer 5.5+ */
}
答案 5 :(得分:0)
我已经尝试了所有方法,pre / code并不是真正的解决方案,但是我们还有其他3个简单的解决方案
<textarea name="tex" id="texa" cols="30" rows="10"class="one textarea">
here is ok, mama? <a href="#">aoeueouoe</a>
</textarea>
texa.value+='<br>\n\n'+i;
<xmp>
keyi1xiedaimama? <a href="#">aoeueouoe</a>
</xmp>
info.appendChild(document.createTextNode(texa.value));