首页 > html > text > Page Widget - 如何剪辑文本宽度

Page Widget - 如何剪辑文本宽度

text 【text】
我们想知道如何剪辑文本宽度。
代码展示 运行结果 

<!DOCTYPE html>
<html>
<head>
  <style type='text/css'>
      section {
        display: block;
        border: 1px dashed silver;
        width:  35em;
        margin-bottom: 1em;
        padding: 0 1em;
        border-radius: 0.5em;
        background-color: rgb(234, 237, 237);
        box-shadow: 1px 1px 2px silver inset;
      }
      section p {
        white-space: nowrap;
        overflow: hidden;
      }
      #ellipsis-multiline {
        margin-bottom: 3em;
      }
      #clip p {
        text-overflow: clip;
      }
      #ellipsis p {
        text-overflow: ellipsis;
      }
      #ellipsis-multiline p {
        white-space: normal;
        height: 3em;
        text-overflow: -o-ellipsis-lastline;
      }
  </style>
</head>
<body>
    <section id="clip">
    <p>This text will be clipped.
    This text will be clipped. This text will be clipped.
    This text will be clipped. This text will be clipped.
    This text will be clipped. This text will be clipped.
    </p>
  </section>
</body>
</html>