Rumah > Artikel > hujung hadapan web > 文字溢出隐藏后添加省略号
当我们想让文字溢出后隐藏并添加省略号的效果
在当前容器或父容器必须要设置宽度,否则代码会失效。
<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> }
Atas ialah kandungan terperinci 文字溢出隐藏后添加省略号. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!