怎么让表格为固定大小，超出的部分显示为省略号

<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> <title> new document </title> <style> .ctl{ table-layout:fixed } .ctl td{text-overflow:ellipsis;overflow:hidden;white-space: nowrap;padding:2px} </style> <table cellspacing="0" cellpadding="1" width="100%" class="ctl" border="1"> <colgroup> <col> <col width="60"> </colgroup> <tbody> <tr> <td>标题扩大副教授的士大夫看见似的看来法艰苦但是第十六棵飞机立刻标题扩大副教授的士大夫看见似的看来法艰苦但是第十六棵飞机立刻</td> <td>(1/1)</td> </tr> <tr> <td>标题扩大副教授的士大夫看见似的看来法艰苦但是第十六棵飞机立刻标题扩大副教授的士大夫看见似的看来法艰苦但是第十六棵飞机立刻</td> <td>(1/1)</td> </tr> <tr> <td>标题扩大副教授的士大夫看见似的看来法艰苦但是第十六棵飞机立刻标题扩大副教授的士大夫看见似的看来法艰苦但是第十六棵飞机立刻</td> <td>(1/1)</td> </tr> <tr> <td>标题扩大副教授的士大夫看见似的看来法艰苦但是第十六棵飞机立刻标题扩大副教授的士大夫看见似的看来法艰苦但是第十六棵飞机立刻</td> <td>(1/1)</td> </tr> </tbody> </table>
[ctrl+a 全选 注:如需引入外部js需刷新才能执行]

如果是在<div></div>或者<li></li>里面又怎么做呢？

<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> <title> new document </title> <style> .ctl {text-overflow:ellipsis;overflow:hidden;white-space: nowrap;padding:2px} </style> <div class="ctl" style="width:234;height:99;background:cyan;">标题扩大副教授的士大夫看见似的看来法艰苦但是第十六棵飞机立刻标题扩大副教授的士大夫看见似的看来法艰苦但是第十六棵飞机立刻</div> <ul class="ctl" style="width:234;"> <li>标题扩大副教授的士大夫看见似的看来法艰苦但是第十六棵飞机立刻标题扩大副教授的士大夫看见似的看来法艰苦但是第十六棵飞机立刻</li> <li>标题扩大副教授的士大夫看见似的看来法艰苦但是第十六棵飞机立刻标题扩大副教授的士大夫看见似的看来法艰苦但是第十六棵飞机立刻</li> </ul>
[ctrl+a 全选 注:如需引入外部js需刷新才能执行]

text-overflow:ellipsis;