如何实现网页表格中一行多出的文字变成省略号或者隐藏

上传了图片,就是欧洲国际铸造展览会暨铝制品展览会这个标题太长了,它自己换行了,我想让他在1行实现,多余的部分用省略号或者隐藏。以下是我表格的代码,我用的是asp,高人指点... 上传了图片,就是欧洲国际铸造展览会暨铝制品展览会这个标题太长了,它自己换行了,我想让他在1行实现,多余的部分用省略号或者隐藏。
以下是我表格的代码,我用的是asp,高人指点。

<table width="290" height="240" border="0" cellpadding="0" cellspacing="0" class="border4" >
<tr>
<th height="26" background="Images/title-bg.jpg" scope="col"><table width="283" height="21" border="0">
<tr>
<th width="26" scope="col"><img src="images/sanjiao-tb.gif" width="9" height="8" /> </th>
<th width="194" scope="col"><div align="left">2010年项目</div></th>
<th width="49" scope="col"><span class="amore STYLE4">>>more</span><span class="STYLE4"> </span></th>
</tr>
</table></th>
</tr>
<tr>
<td height="211" align="left"><%
NodeCode="00090001"
InfoLink="Newsinfo.asp"
Rows=7
WordSize=34
ListImg="<span style='font-family: Webdings'>4</span>"
HaveTime=true
HaveAlternation=true
AlternationPic=""
width="95%"
height=15
FirstColWidth="70%"
SecondColWidth= ""
CssClass="15"
call IndexNewsList(NodeCode,InfoLink,Rows,WordSize,ListImg,HaveTime,HaveAlternation,AlternationPic,width,height,FirstColWidth,CssClass) %> 

</td>
</tr>
</table>
告诉我添加到哪里,本人初学者
展开
 我来答
南京新华电脑专修学院
2018-07-30 · 新华电脑教育用心为户提供专业
南京新华电脑专修学院
新华电脑教育用心为户提供专业的电脑相关专业疑问解答
向TA提问
展开全部
实现代码如下:
.mytable{
width:500em;
table-layout:fixed;/* 只有定义了表格的布局算法为fixed,下面td的定义才能起作用。 */
}
.mytable td{
width:100%;
word-break:keep-all;/* 不换行 */
white-space:nowrap;/* 不换行 */
overflow:hidden;/* 内容超出宽度时隐藏超出部分的内容 */
text-overflow:ellipsis;/* 当对象内文本溢出时显示省略标记(...) ;需与overflow:hidden;一 起使用。*/
}

采用 css 样式 来隐藏
<style type="text/css">
.style1{
overflow: hidden;
white-space:nowrap;
text-overflow: ellipsis;
width:200px;
}
</style>
一般添加到<head>之间即可。
笑他乱心情5176
2009-11-18 · TA获得超过355个赞
知道答主
回答量:23
采纳率:0%
帮助的人:12.6万
展开全部
<table width="290" height="240" border="0" cellpadding="0" cellspacing="0" class="border4" >
<tr>
<th height="26" background="Images/title-bg.jpg" scope="col"><table width="283" height="21" border="0">
<tr>
<th width="26" scope="col"><img src="images/sanjiao-tb.gif" width="9" height="8" /> </th>
<th width="194" scope="col"><div align="left">2010年项目</div></th>
<th width="49" scope="col"><span class="amore STYLE4">>>more</span><span class="STYLE4"> </span></th>
</tr>
</table></th>
</tr>
<tr>
<td height="211" align="left"><%
NodeCode="00090001"
InfoLink="Newsinfo.asp"
Rows=7
WordSize=34
ListImg="<span style='font-family: Webdings'>4</span>"
HaveTime=true
HaveAlternation=true
AlternationPic=""
width="95%"
height=15
FirstColWidth="70%"
SecondColWidth= ""
CssClass="15"
call IndexNewsList(NodeCode,InfoLink,Rows,WordSize,ListImg,HaveTime,HaveAlternation,AlternationPic,width,height,FirstColWidth,CssClass) %>

</td>
</tr>
</table>
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
shihoumacili
高粉答主

2016-01-30 · 每个回答都超有意思的
知道大有可为答主
回答量:1.1万
采纳率:87%
帮助的人:487万
展开全部
实现代码如下:
.mytable{
width:500em;
table-layout:fixed;/* 只有定义了表格的布局算法为fixed,下面td的定义才能起作用。 */
}
.mytable td{
width:100%;
word-break:keep-all;/* 不换行 */
white-space:nowrap;/* 不换行 */
overflow:hidden;/* 内容超出宽度时隐藏超出部分的内容 */
text-overflow:ellipsis;/* 当对象内文本溢出时显示省略标记(...) ;需与overflow:hidden;一 起使用。*/
}

采用 css 样式 来隐藏
<style type="text/css">
.style1{
overflow: hidden;
white-space:nowrap;
text-overflow: ellipsis;
width:200px;
}
</style>
一般添加到<head>之间即可。
本回答被网友采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
飞莎网络
2009-11-18 · TA获得超过332个赞
知道小有建树答主
回答量:490
采纳率:0%
帮助的人:412万
展开全部
采用 css 样式 来设置

<style type="text/css">
.style1{
overflow: hidden;
white-space:nowrap;
text-overflow: ellipsis;
width:200px;
}
</style>
一般添加到<head>之间
本回答被提问者采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
希栗念倒主1I
2009-11-13 · 超过18用户采纳过TA的回答
知道答主
回答量:42
采纳率:0%
帮助的人:0
展开全部
.style1{
overflow: hidden;
white-space:nowrap;
text-overflow: ellipsis;
-o-text-overflow: ellipsis;
width:200px;
}
应用样式,不过只有IE有效。

...
<tr>
<td><div class="style1">欧洲国际铸造展览会暨铝制品展览会这个标题太长了</div></td>
...
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 更多回答(3)
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式