利用<pre></pre>这个标签可以将其包起来的文字排版、格式,原封不动的呈现出来。
也就是说你输入的东西被原封不动的输出,包括你输入的空格之类的,不用 和<BR>等来表示空格或者回车了。

但是,默认情况下,<pre /> 标签中的内容若超出范围不会自动换行,这样无论在显示或打印都会出现麻烦。

下面提供符合 W3C 标准并支持多浏览器的 CSS 样式代码:

pre{
white-space:pre-wrap;
white-space:-moz-pre-wrap;
white-space:-pre-wrap;
white-space:-o-pre-wrap;
word-wrap:break-word;
}

父标记最好加个DIV,并设置CSS属性:

word-wrap: break-word;white-space : normal

【HTML】让<pre>标签文本自动换行的更多相关文章

  1. pre标签内文本自动换行

    pre标签内文本自动换行 给pre标签添加一个css样式 pre { white-space: pre-wrap; /* css-3 */ white-space: -moz-pre-wrap; /* ...

  2. 让pre标签自动换行示例代码

    pre 元素可定义预格式化的文本.被包围在 pre 元素中的文本通常会保留空格和换行符.而文本也会呈现为等宽字体. <pre> 标签的一个常见应用就是用来表示计算机的源代码.对于技术博客经 ...

  3. Pre标签 自动换行

    <pre> 元素可定义预格式化的文本.被包围在 pre 元素中的文本通常会保留空格和换行符.而文本也会呈现为等宽字体. <pre> 标签的一个常见应用就是用来表示计算机的源代码 ...

  4. 解决<pre>标签里的文本换行(兼容IE, FF和Opera等)

      我们都知道<pre> 标签可定义预格式化的文本,一个常见应用就是用来表示计算机的源代码.被包围在 pre 元素中的文本通常会保留空格和换行符,但不幸的是,当你在<pre>标 ...

  5. pre标签 首行会自动换行解决方案

    利用pre标签可以 解决文本文档里面的空格及换行在页面上不显示的方案, 自行换行 加 white-space: pre-wrap; word-wrap: break-word; 英文字母换行 word ...

  6. <pre></pre>标签自动换行

    原文地址:https://www.cnblogs.com/qq78292959/p/4193142.html   pre { white-space: pre-wrap; word-wrap: bre ...

  7. 使pre的内容自动换行

    <pre> 元素可定义预格式化的文本.被包围在 pre 元素中的文本通常会保留空格和换行符.而文本也会呈现为等宽字体. <pre> 标签的一个常见应用就是用来表示计算机的源代码 ...

  8. [HTML Q&A][转]使pre的内容自动换行

    <pre> 元素可定义预格式化的文本.被包围在 pre 元素中的文本通常会保留空格和换行符.而文本也会呈现为等宽字体. <pre> 标签的一个常见应用就是用来表示计算机的源代码 ...

  9. 使pre的内容自动换行(转)

    <pre> 元素可定义预格式化的文本.被包围在 pre 元素中的文本通常会保留空格和换行符.而文本也会呈现为等宽字体. <pre> 标签的一个常见应用就是用来表示计算机的源代码 ...

随机推荐

  1. Python 第十三篇之一:前端页面 js和dome

    一:JavaScript: JavaScript是一门编程语言,浏览器内置了JavaScript语言的解释器,所以在浏览器上按照JavaScript语言的规则编写相应代码之,浏览器可以解释并做出相应的 ...

  2. 数据库中操作XML(openXML)

    最近公司项目需要在数据库中操作XML,因此系统的学习了一下 一.openxml的格式 OPENXML( idoc int [ in] , XPathnvarchar [ in ] , [ flags ...

  3. Linux环境下编译并执行ava helloworld程序

    原文:http://blog.lupaworld.com/home-space-uid-24466-do-blog-id-2578.html 已经学会怎样在Windows下怎样编辑,编译和运行Java ...

  4. Eclipse3.6 添加JUnit源代码

    Eclipse中无法查看JUnit源代码,也无法设置源代码的jar. 解决方法: 1.  下载org.junit.source_4.8.1.v4_8_1_v20100427-1100.jar,放到ec ...

  5. 联想K82------智能电视行业的野蛮入侵者

    智能电视行业近年来“渐入佳境”,一方面得力于智能手机.平板电脑的普及让数码产品的智能化趋势深入人心,智能电视自然成了IT行业的下一个增长点:另一方面则得力于部分企业敢于第一个吃螃蟹,通过他们的创新和开 ...

  6. Android 实现在线程中联网

    其实我们要牢记的是,对数据流的操作都是阻塞的,在一般情况下,我们是不需要考虑这个问题的,但是在Android 实现联网的时候,我们必须考虑到这个问题.比如:从网络上下载一张图片: Java代码: pu ...

  7. cxf调用c#的webservice

    java调用c#的webservice,如今已经測试通过.并且用到了项目中. 如今把实现方式和遇到的问题分享给大家.详细源代码例如以下: JaxWsDynamicClientFactory dcf = ...

  8. C语言中关于scanf函数的用法

    scanf()函数的控制串 函数名: scanf 功 能: 执行格式化输入 用 法: int scanf(char *format[,argument,...]); scanf()函数是通用终端格式化 ...

  9. WCF技术剖析之二十九:换种不同的方式调用WCF服务[提供源代码下载]

    原文:WCF技术剖析之二十九:换种不同的方式调用WCF服务[提供源代码下载] 我们有两种典型的WCF调用方式:通过SvcUtil.exe(或者添加Web引用)导入发布的服务元数据生成服务代理相关的代码 ...

  10. windows安装Apache,注册服务出现“(OS 5)拒绝访问。 : AH00369: Failed to open the WinNT service manager..."错误

    原文:http://blog.csdn.net/jaray/article/details/9950211 在安装Apache的时候,我下载的是zip格式,不是msi安装版,需要自己注册服务,才能在桌 ...