标签：
clip：当内联内容溢出块容器时，将溢出部分裁切掉。
ellipsis：当内联内容溢出块容器时，将溢出部分替换为（...）。
当块容器 <‘ overflow ‘> 为非visible时，定义内联内容溢出其块容器是否截断或者添加(...)及自定义字符 要使得 <‘ text-overflow ‘> 属性生效，块容器必须显式定义 <‘ overflow ‘> 为非visible值，同时显式或者隐式的定义 <‘ width ‘> 为非auto值， <‘ white-space ‘> 为nowrap值。
我们将text-overflow生效必备的3个属性： <‘ overflow ‘> , <‘ width ‘> 和 <‘ white-space ‘> 都直接定义在了内联内容的父级块容器上
<!DOCTYPE html> <html lang="zh-cmn-Hans"> <head> <meta charset="utf-8" /> <title>text-overflow_CSS参考手册_web前端开发参考手册系列</title> <style> .test li{margin-top:10px;} .test .clip p{overflow:hidden;width:200px;white-space:nowrap;text-overflow:clip;} .test .ellipsis p{overflow:hidden;width:200px;white-space:nowrap;text-overflow:ellipsis;} </style> </head> <body> <ul class="test"> <li class="clip"> <strong>clip: 直接将溢出的文字裁剪</strong> <p>测试用文字测试用文字测试用文字测试用文字测试用文字测试用文字</p> </li> <li class="ellipsis"> <strong>ellipsis: 将溢出的文字显示省略标记（...）</strong> <p>测试用文字测试用文字测试用文字测试用文字测试用文字测试用文字</p> </li> </ul> </body> </html>
原文出处：http://gucong3000.github.io/css-book/properties/user-interface/text-overflow.htm
标签：
原文地址：http://www.cnblogs.com/zxyun/p/4724605.html
