让pre标签自动换行示例代码
pre 元素可定义预格式化的文本。被包围在 pre 元素中的文本通常会保留空格和换行符。而文本也会呈现为等宽字体。
<pre> 标签的一个常见应用就是用来表示计算机的源代码。对于技术博客经常会用到pre标签输出代码或是代码高亮,而默认情况下,pre 标签中的内容若超出范围不会自动换行。
下面介绍一个方法让 <pre > 标签中的内容自动换行并符合 W3C 标准(多浏览器支持)pre{
white-space:pre-wrap; /* css3.0 */
white-space:-moz-pre-wrap; /* Firefox */
white-space:-pre-wrap; /* Opera 4-6 */
white-space:-o-pre-wrap; /* Opera 7 */
word-wrap:break-word; /* Internet Explorer 5.5+ */
}
示例:pre{white-space:pre-wrap; white-space:-moz-pre-wrap; white-space:-pre-wrap; white-space:-o-pre-wrap; word-wrap:break-word; /*我是一个很长很长的代码,看我换行了木有?*/}
让pre标签自动换行示例代码的更多相关文章
- Pre标签 自动换行
<pre> 元素可定义预格式化的文本.被包围在 pre 元素中的文本通常会保留空格和换行符.而文本也会呈现为等宽字体. <pre> 标签的一个常见应用就是用来表示计算机的源代码 ...
- <pre></pre>标签自动换行
原文地址:https://www.cnblogs.com/qq78292959/p/4193142.html pre { white-space: pre-wrap; word-wrap: bre ...
- code标签和pre标签
code标签: 1.code标签的定义: <code>标签, 用于表示计算机源代码或者其他机器可以阅读的文本内容.软件代码的编写者习惯了编写代码时的代码格式,那么这个<code> ...
- code标签和pre标签的定义
前些日子一同事问了我一个关于code标签和pre标签的问题,嗯,是的,这两个标签凑到一块,便出现了问题.于是总结了一下.此文就重点谈一下code标签和pre标签喽,谈谈他们的定义,区别,应用以及这两个 ...
- 解决<pre>标签里的文本换行(兼容IE, FF和Opera等)
我们都知道<pre> 标签可定义预格式化的文本,一个常见应用就是用来表示计算机的源代码.被包围在 pre 元素中的文本通常会保留空格和换行符,但不幸的是,当你在<pre>标 ...
- 使用<pre>标签为你的网页加入大段代码
在上节中介绍加入一行代码的标签为<code>,但是在大多数情况下是需要加入大段代码的,如下图: 怎么办?不会是每一代码都加入一个<code>标签吧,没有这么复杂,这时候就可以使 ...
- 【HTML】让<pre>标签文本自动换行
利用<pre></pre>这个标签可以将其包起来的文字排版.格式,原封不动的呈现出来. 也就是说你输入的东西被原封不动的输出,包括你输入的空格之类的,不用 和<BR> ...
- pre标签内文本自动换行
pre标签内文本自动换行 给pre标签添加一个css样式 pre { white-space: pre-wrap; /* css-3 */ white-space: -moz-pre-wrap; /* ...
- pre标签 首行会自动换行解决方案
利用pre标签可以 解决文本文档里面的空格及换行在页面上不显示的方案, 自行换行 加 white-space: pre-wrap; word-wrap: break-word; 英文字母换行 word ...
随机推荐
- 【查找结构4】红黑树 [RBT]
红黑树的性质与定义 红黑树(red-black tree) 是一棵满足下述性质的二叉查找树: 1. 每一个结点要么是红色,要么是黑色. 2. 根结点是黑色的. 3. 所有叶子结点都是黑色的(实际上都是 ...
- node-odata: 基于 NodeJS 的 REST 框架
该开源项目目前已被 OData 官网 (odata.org)收录 关于 node-odata node-odata 可以让你轻松创建 REST API, 并能使用 OData 协议的格式进行数据的查询 ...
- URAL 1066 Garland 二分
二分H2的位置,判断条件为是否有Hi < 0 #include <cstdio> #include <cstring> #include <cstdlib> ...
- php post和get
作为一个计算机系统,输入输出设备作为非核心设备却是不可或缺的,硬件如此,软件亦是如此.试想一台功能强劲的计算机,如果没有输入输出设备,它与一块只能耗电并且发出嗡嗡噪音的废铁有何不同.应用程序的道理也是 ...
- POJ 1743 Musical Theme(后缀数组)
题意:有n个数值,算出相邻两个值的差值,此时有n-1个值的序列,把这序列当做字符串的话,求最长重复子串,且这两个子串不能重叠. 分析:后缀数组解决.先二分答案,把题目变成判定性问题:判断是否存在两个长 ...
- springmvc 中常用的注解配置使用说明
很久没有用springmvc了,今天复习了一下,然后记录一下总结. @Controller 使用 @Controller 注释对将成为 MVC 中控制器的类进行注释并处理 HTTP 请求. @ ...
- 【HDOJ】5657 CA Loves Math
1. 题目描述对于给定的$a, n, mod, a \in [2,11], n \in [0, 10^9], mod \in [1, 10^9]$求出在$[1, a^n]$内的所有$a$进制下的数并且 ...
- mysql 字符串函数
对于针对字符串位置的操作,第一个位置被标记为1. ASCII(str) 返回字符串str的 最左面字符的ASCII代码值.如果str是空字符串, 返回0.如果str是NULL,返回NULL. mysq ...
- [Golang]实习最后一天小纪念+并发爬虫小练习
今天是我在公司实习的最后一天,一个月的时间真的是太短暂了,我非常享受在公司工作的这一个月,在这里Leader和同事们对我的帮助极大地促进了我技术水平的进步和自信心的提升,我发自内心地感谢白山云科技给我 ...
- 在AChartEngine上绘图,手指标记当前位置
最近要做一个绘图项目,需要在ACE折线图上再绘出一条红标记当前坐标,经过这几天研究,可以给大家分享一下了.先上效果图吧! 代码里的注释还是比较清楚,就不作说明了. package com.exampl ...