HTML基础之pre和code的作用和用法
2016-11-27 本文已影响131人
陈锦楣
定义
- code标签用于表示计算机源代码或者其他机器可以阅读的文本内容。
- pre 元素可定义预格式化的文本。被包围在 pre 元素中的文本通常会保留空格和换行符。而文本也会呈现为等宽字体。
用法&区别
- 当你在网页中只需要显示
一行代码时便使用<code>去添加。 - 当你需要在网页中显示许
多行代码的时候便使用<pre>去添加。
例子
- code例子
<body>
<code><script type="text/javascript"></code>//只能添加一行
</body>
//若这里不加code那就会执行script标签，那么页面便会去获取指定的js文件
运行结果
code示例.png
往code里添加格式
<body>
<code>
<script type="text/javascript">
</body>
</html>
</code>
</body>
运行结果
code示例.png
会发现格式并没有保存下来，都合并为一行了。
- pre例子
<body>
<pre>
<script type="text/javascript">
function test1() {
var div1 = document.getElementById("div1");
div1.innerHTML = "<span>一起来编程吧！</span>";
}
</script>
<body>
<div id="div1">
<a href="https://bbs.excellence-girls.org/" target="_blank">卓越女生论坛</a>
</div>
<input type="button" value="提交" onclick="test1();" />
</body>
</html>
</pre>
</body>
运行结果
pre例子.png
代码里的空格及符号都原封不动的保存下来了。
