Home >Web Front-end >HTML Tutorial >Let the pre tag automatically wrap the sample code_HTML/Xhtml_Web page production
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 thetag automatically wrap and comply with W3C standards (multi-browser support)
Copy codeThe 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 codeThe 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? */}