HTML pre元素
pre元素
一般情况下,浏览器会将网页中所有额外的回车和空格进行压缩,并根据窗口的大小自动换行。如果希望文本能够按预先定义好的格式原样显示,就可以使用pre元素。
pre元素表示一块被格式化的文本,其作用是保留原始文本的排版效果,也就是说,被包围在 pre元素中的文本,通常会保留回车、换行、空格、制表符等。因此,它是展示计算机程序源代码的理想元素。
当用 pre元素来展示源代码时,最好的方式是用 code 元素来包裹代码,这样既可以保持格式,又不失其语义。
<pre>
<code>
for (int i = 0; i < 10; i++) {
printf("Hello world!\n");
}
</code>
</pre>
运行结果如图 2‑10 所示:
图2-10 pre元素
pre元素中的文本,也可以是HTML元素,如链接、图像和水平分隔线。当把其他标签,如 <a> 标签,放到 pre元素中时,会被直接渲染为正常元素。因此,需要将 pre元素中的特殊符号被转换为符号实体。如,将 "<" 转换为 "<",将 ">" 转换为 ">" 等等。
版权声明:本文出自 歪脖网 的《HTML5宝典》,欢迎在线阅读,并提出宝贵意见。
HTML pre元素相关推荐
- xhtml代码 中<pre>元素简单介绍
<?xml version = "1.0" encoding = "UTF-8"?> <!DOCTYPE htmlPUBLIC"-/ ...
- php中pre标签作用,HTML元素pre标签的使用方法及作用
html元素 标签常见用途是表示计算机的源代码,且会保留空格和换行符.有关该标签的使用方法及作用介绍如下: 标签的定义 标签定义预格式化的文本,且文本以等宽字体呈现: 标签最常见的用途是表示计算机的源 ...
- 网页制作基础:各种元素解析
为什么80%的码农都做不了架构师?>>> 终于步入正轨,开始制作网页了.对于现在的我而言,制作一些大型网站的静态网页也是很痛苦的一件事情,但是,罗马不是一天修成的,尤其是这个工 ...
- html中<pre>标签
pre翻译为预处理标签 菜鸟教程内的定义: <pre> 标签可定义预格式化的文本. 被包围在 <pre> 标签 元素中的文本通常会保留空格和换行符.而文本也会呈现为等宽字体. ...
- html怎么让文本自动换行不,【HTML】让pre标签文本自动换行
利用 这个标签可以将其包起来的文字排版.格式,原封不动的呈现出来. 也就是说你输入的东西被原封不动的输出,包括你输入的空格之类的,不用 和 等来表示空格或者回车了. 但是,默认情况下, 标签中的内容若 ...
- php输出pre自动换行,解决 html pre 标签的内容自动换行的问题
元素可定义预格式化的文本.被包围在 pre 元素中的文本通常会保留空格和换行符.而文本也会呈现为等宽字体. 标签的一个常见应用就是用来表示计算机的源代码. 而我们经常碰到的一个问题是如果一个代码上碰到 ...
- php中pre标签,html中pre标签与code标签的作用与用法
HTML 标签 定义和用法 pre 元素可定义预格式化的文本.被包围在 pre 元素中的文本通常会保留空格和换行符.而文本也会呈现为等宽字体. 标签的一个常见应用就是用来表示计算机的源代码. 可以导致 ...
- (一)html5中的新增元素和废除元素
//刘梦冰发表于2015-6-29 1.新增的结构元素 (1)section元素 section元素表示页面中的一个内容区块,比如章节.页眉.页脚或者页面中的其他部分,它可以与h1.h2.h3等元素结 ...
- HTML块级元素/块标签/块元素
文章目录 块元素的特点 块元素清单 block level element. 块级元素想在同一行显示需浮动或者 display:inline. 块元素的特点 每个块级元素都是独自占一行,其后的元素也只 ...
最新文章
- Tenka1 Programmer Contest C - Align
- 使用tensorflow训练数据时遇到的问题总结
- 学术部活动具体落实计划
- hdu 1532(最大流)
- 注解方式使用 Redis 缓存
- QT 调用 DLL 的三种方法
- 首批国家应用数学中心:广东独占2家
- 国际运营版Java区块链交易所源码币币+法币+永续+期权+机器人
- JAVA面试之互联网、经验篇
- 自动控制原理(第七版)胡寿松 课本
- wap网游php源码,wap 文字游戏
- CentOS 6虚拟机Hadoop安装教程
- 关于filenet中的folder以及document简单操作
- mysql 不等于 优化_Mysql优化
- matlab画椭圆 长轴 短轴,跟踪目标的快速椭圆拟合方法
- 没什么经验的UE/UI设计师如何应对面试
- select获取选中的option(包含value和text,重点是text怎么获取)
- 在eclipse中使用subclipse
- 【C++】STL容器
- mysql left_mysql的left函数
热门文章
- 小试MemSQL (The World's Fastest Database?)
- 移动电子商务,“移动”至生活
- 利用IIS建立高安全性Web服务器
- 福建地震局网站被******挂壮阳广告
- 疫情中该如何保证高效远程办公(1)-员工到底是在家办公,还是在家躺着??
- Ubuntu14.04安装与卸载ROS(避坑教程)配kinetic版本安装官方网址
- Redis持久化方式之RDB
- 技巧:在Silverlight中如何访问外部xap文件中UserControl
- 深信服云计算BU专家组组长王佳玮:全融合时代的企业云新架构
- JS 用JS实现跟随光标的提示