文字溢出隱藏後添加省略號

當我們想讓文字溢出後隱藏並添加省略號的效果

在目前容器或父容器必須要設定寬度，否則程式碼會失效。 

<span style="color: #800000">.box</span>{<span style="color: #ff0000">
         width</span>:<span style="color: #0000ff">50%</span>;<span style="color: #ff0000">
         text-overflow </span>:<span style="color: #0000ff">ellipsis</span>;<span style="color: #008000">/*</span><span style="color: #008000"> 文字隐藏后添加省略号 </span><span style="color: #008000">*/</span><span style="color: #ff0000">
         white-space </span>:<span style="color: #0000ff"> nowrap</span>;<span style="color: #008000">/*</span><span style="color: #008000"> 强制不换行 </span><span style="color: #008000">*/</span><span style="color: #ff0000">
         overflow </span>:<span style="color: #0000ff"> hidden</span>;<span style="color: #008000">/*</span><span style="color: #008000">自动隐藏文字</span><span style="color: #008000">*/</span><span style="color: #ff0000">
         width</span>:<span style="color: #0000ff"> 20em</span>;<span style="color: #008000">/*</span><span style="color: #008000">不允许出现半汉字截断</span><span style="color: #008000">*/</span>
    } 

以上是文字溢出隱藏後添加省略號的詳細內容。更多資訊請關注PHP中文網其他相關文章！