【HTML】让<pre>标签文本自动换行
利用<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>标签文本自动换行的更多相关文章
- pre标签内文本自动换行
pre标签内文本自动换行 给pre标签添加一个css样式 pre { white-space: pre-wrap; /* css-3 */ white-space: -moz-pre-wrap; /* ...
- 让pre标签自动换行示例代码
pre 元素可定义预格式化的文本.被包围在 pre 元素中的文本通常会保留空格和换行符.而文本也会呈现为等宽字体. <pre> 标签的一个常见应用就是用来表示计算机的源代码.对于技术博客经 ...
- Pre标签 自动换行
<pre> 元素可定义预格式化的文本.被包围在 pre 元素中的文本通常会保留空格和换行符.而文本也会呈现为等宽字体. <pre> 标签的一个常见应用就是用来表示计算机的源代码 ...
- 解决<pre>标签里的文本换行(兼容IE, FF和Opera等)
我们都知道<pre> 标签可定义预格式化的文本,一个常见应用就是用来表示计算机的源代码.被包围在 pre 元素中的文本通常会保留空格和换行符,但不幸的是,当你在<pre>标 ...
- pre标签 首行会自动换行解决方案
利用pre标签可以 解决文本文档里面的空格及换行在页面上不显示的方案, 自行换行 加 white-space: pre-wrap; word-wrap: break-word; 英文字母换行 word ...
- <pre></pre>标签自动换行
原文地址:https://www.cnblogs.com/qq78292959/p/4193142.html pre { white-space: pre-wrap; word-wrap: bre ...
- 使pre的内容自动换行
<pre> 元素可定义预格式化的文本.被包围在 pre 元素中的文本通常会保留空格和换行符.而文本也会呈现为等宽字体. <pre> 标签的一个常见应用就是用来表示计算机的源代码 ...
- [HTML Q&A][转]使pre的内容自动换行
<pre> 元素可定义预格式化的文本.被包围在 pre 元素中的文本通常会保留空格和换行符.而文本也会呈现为等宽字体. <pre> 标签的一个常见应用就是用来表示计算机的源代码 ...
- 使pre的内容自动换行(转)
<pre> 元素可定义预格式化的文本.被包围在 pre 元素中的文本通常会保留空格和换行符.而文本也会呈现为等宽字体. <pre> 标签的一个常见应用就是用来表示计算机的源代码 ...
随机推荐
- Chapter 2.策略模式
首先贴一段代码: package xiao; import java.util.Scanner; class CashSuper{ private int num; private dou ...
- JAVA的一些小笔记
构造块优先于构造方法执行,而且每当有一个新的实例化对象产生时,就会重复执行构造块的程序. 静态块优先于构造块执行,而且不管有多少个实例化对象产生,静态块只会执行一次,它的主要作用是为类中的static ...
- 再造 “手机QQ” 侧滑菜单(三)——视图联动
代码示例:https://github.com/johnlui/SwiftSideslipLikeQQ 本 文中,我们将一起使用 UINavigationController 来管理主视图,并实现点击 ...
- SimpleAdapter
1.视图 1)主视图 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" x ...
- SDK Hello world(直接使用SDK封装)
前言 将代码拆分了一下, 如果处理更多的消息也不怕看的眼花 SDK编程就是对各种Windows消息的处理 实验工程 /// @file exam_1.cpp /// @brief 查阅本地MSDN, ...
- 设计模式(五)适配器模式Adapter(结构型)
设计模式(五)适配器模式Adapter(结构型) 1. 概述: 接口的改变,是一个需要程序员们必须(虽然很不情愿)接受和处理的普遍问题.程序提供者们修改他们的代码;系统库被修正;各种程序语言以及相 ...
- Convert SVG to PNG in Python - Stack Overflow
Convert SVG to PNG in Python - Stack Overflow Convert SVG to PNG in Python
- Django的url解析
Django中采用正则表达式来匹配所请求的url,这个叫做URLconf,作为MVC中的C(控制器), 这样再调用相应的试图,达到控制器控制试图的显示的效果. 看一下Django的url解析过程 第一 ...
- Jump的计划
欢迎訪问我的github:https://github.com/xdnm 1.熟悉cocos2dx2.2.3开发框架 a.熟悉cocos2d api ...
- GCC 编译使用动态链接库和静态链接库的方法
1 库的分类 依据链接时期的不同,库又有静态库和动态库之分. 静态库是在链接阶段被链接的.所以生成的可执行文件就不受库的影响了.即使库被删除了,程序依旧能够成功执行. 有别于静态库,动态库的链接是在程 ...