Home >Web Front-end >HTML Tutorial >Let the pre tag automatically wrap the sample code_HTML/Xhtml_Web page production

Let the pre tag automatically wrap the sample code_HTML/Xhtml_Web page production

WBOY
WBOYOriginal
2016-05-16 16:39:141366browse

The pre element defines preformatted text. Text enclosed in a pre element usually preserves whitespace and newlines. The text will also be rendered as a fixed-width font. A common application of the

 tag is to represent computer source code. For technical blogs, pre tags are often used to output code or code highlighting. By default, the content in the pre tag will not wrap automatically if it exceeds the range. 
The following is a method to make the content in the
 tag automatically wrap and comply with W3C standards (multi-browser support) 

Copy code
The code is as follows:

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 */
}

Example:

Copy the code
The code is as follows:

pre{white-space:pre-wrap; white-space:-moz-pre-wrap; white-space:-pre -wrap; white-space:-o-pre-wrap; word-wrap:break-word; /*I have a very, very long code. Did I break the line? */}
Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn