Detailed explanation of the use of whitespace effect attributes in CSS-CSS Tutorial-php.cn

Detailed explanation of the use of whitespace effect attributes in CSS

高洛峰

Release： 2017-03-08 15:26:51

Original

1948 people have browsed it

white-space

white-space is used to set the browser's processing of "blank". The so-called blank refers to the space you enter in the editor. , carriage return, tab, etc. Its optional content is as follows:

normal: Default. White space is ignored by the browser. For example: whitespace at the beginning and end is ignored, no matter how many spaces or carriage returns there are between words, only one space is displayed, and the space before the line break is ignored
pre: Whitespace will be retained by the browser. It behaves like the

 tag in HTML. <br>nowrap: No line breaks, unless <br /> is encountered, n spaces will be compressed into one. <br>pre-wrap: Keep all whitespace, but wrap lines normally (chrome, FF, IE8+, Opera), equivalent to normal under IE6 and IE7 <br>pre-line: Combine whitespace sequences (merge into one) , but retain line breaks (chrome, FF, IE8+, Opera), which are equivalent to normal</p>
<p><strong>word-spacing and letter-spacing<br></strong>word-spacing under IE6 and IE7. It works between words in English, but is invalid for Chinese. <br>Letter-spacing can work for Chinese. </p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class='brush:php;toolbar:false;'><html>   
 <head>   
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8"></meta>   
  <style type="text/css">   
   p.spread {letter-spacing: 30px;}   
  </style>   
 </head>   
 <body>   
  <p class="spread">This is some text.哈哈哈哈哈哈哈</p>   
  <p class="tight">This is some text.This is some text.</p>   
 </body>   
</html>

Copy after login

The above is the detailed content of Detailed explanation of the use of whitespace effect attributes in CSS. For more information, please follow other related articles on the PHP Chinese website!