Home > Web Front-end > HTML Tutorial > How is the csdn code effect achieved? _html/css_WEB-ITnose

How is the csdn code effect achieved? _html/css_WEB-ITnose

WBOY
Release: 2016-06-24 12:25:12
Original
1020 people have browsed it

<html><head>    ...</head><body>    ...</body></html>
Copy after login
像这样的效果是怎么做到的,用了什么?


回复讨论(解决方案)

我想做整个的代码框功能

Copy after login

http://bbs.csdn.net/assets/sh-e7799bf9690a86571a685dd3015e559c.js

这个js实现的语法高亮

http://bbs.csdn.net/assets/sh-e7799bf9690a86571a685dd3015e559c.js

这个js实现的语法高亮 这代码好乱啊。。。。

压缩过了。。插件名称是SyntaxHighlighter,楼主找找这个插件的API看看

http://alexgorbatchev.com/SyntaxHighlighter/manual/installation.html

http://alexgorbatchev.com/SyntaxHighlighter/manual/installation.html

<pre class="brush: html;"><html>	<head>		...	</head>	<body>		...	</body></html>
Copy after login
这样写的效果就是空白和...,标签都成效果了,不以字符形式显示。我加了后,结果这两个也显示出来了,让标签以字符形式显示出来呢?

要将<>替换为实体<>

要将<>替换为实体<> 那csdn是怎么做到我输入<>就显示<>的呢?

楼主去了解下说明是html实体,csdn已经将<>替换为<>了,之中显示出来就是<>,要是源代码包含<>,就不会显示了

楼主去了解下说明是html实体,csdn已经将<>替换为<>了,之中显示出来就是<>,要是源代码包含<>,就不会显示了 哦哦,明白了。

source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template