text-overflow样式属性值ellipsis的用法
Posted zhchoutai
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了text-overflow样式属性值ellipsis的用法相关的知识，希望对你有一定的参考价值。
? ? ? ? 一、div标签中使用text-overflow样式属性值ellipsis的方法：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>div标签中使用text-overflow样式属性值ellipsis的方法</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> </head> <body> <div style="width:200px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; border:1px solid #336699;">有志气者不会甘居下游，有见识者不敢自满自足。有恒心者断无不成之事！</div> </body> </html>
? ? ? ? 二、table标签子标签td标签中使用text-overflow样式属性值ellipsis的方法：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>table标签子标签td标签中使用text-overflow样式属性值ellipsis的方法</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> </head> <body> <table cellSpacing="0" cellpadding="1" width="456" border="1" style="table-layout:fixed;"> <tr> <td style="text-overflow:ellipsis; overflow:hidden; white-space:nowrap; padding:2px;">有志气者不会甘居下游，有见识者不敢自满自足，有恒心者断无不成之事！</td> </tr> </table> </body> </html>
? ? ? ? 说明：代码二中的样例在某些浏览器（比方：Opera浏览器）中是达不到对应的效果的。