英文字母不截断 white-space属性

 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">
<html xmlns="">

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title>字符换行</title>
  <style type="text/css">
    table,
    td,
    th,
    div {
      border: 1px green solid;
    }

    code {
      font-family: "Courier New", Courier, monospace;
    }
  </style>
</head>

<body>
  <h1><code>div</code></h1>
  <h1><code>All white-space:normal;</code></h1>
  <div style="white-space:normal; width:200px;">Wordwrap still occurs in a td element that has its WIDTH attribute set
    to a value smaller than the unwrapped content of the cell, even if the noWrap property is set to true. Therefore,
    the WIDTH attribute takes precedence over the noWrap property in this scenario</div>


  <h1><code>IE \ word-wrap : break-word ;</code></h1>
  <div style="word-wrap : break-word ; width:200px;">abcdefghijklmnabcdefghijklmnabcdefghijklmn111111111</div>
  <h1><code>IE \ word-break:break-all;</code></h1>
  <div style="word-break:break-all;width:200px;">abcdefghijklmnabcdefghijklmnabcdefghijklmn111111111</div>


  <h1><code>Firefox/ word-break:break-all; overflow:auto;</code></h1>
  <div style="word-break:break-all; width:200px; overflow:auto;">abcdefghijklmnabcdefghijklmnabcdefghijklmn111111111
  </div>
</body>

</html>

 

posted @ 2021-04-26 22:14  yuan_bao_er  阅读(108)  评论(0编辑  收藏  举报