[英]ASP.Net Bootstrap Alert very long message
I am developing a Bootstrap Alert in ASP.Net我正在 ASP.Net 中开发引导警报
This is my code in ASPX:这是我在 ASPX 中的代码:
<asp:Label ID="AlertLB" runat="server"/>
This is my code in CSS这是我在 CSS 中的代码
<style>
.alert {
display: block;
margin-bottom: 1px;
height: 30px;
line-height:30px;
padding:0px 15px;
display:inline-block
}
</style>
This is my Code Behind:这是我的代码背后:
private void SetAlert(string message, string typeAlert)
{
AlertLB.Visible = true;
AlertLB.CssClass = "alert alert-" + typeAlert;
AlertLB.Text = message;
AlertLB.Focus();
}
This works fine when it is a short message but when it is a very long message the text goes outside the alert:当它是一条短消息时,这可以正常工作,但是当它是一条很长的消息时,文本会超出警报:
The perfect solution would be for the text to be truncated to the width of the alert:完美的解决方案是将文本截断为警报的宽度:
Another solution would be for the alert height to be adjusted automatically:另一种解决方案是自动调整警报高度:
According to bootstrap you can add text-truncate
class to alert label:根据引导程序,您可以添加
text-truncate
class 以提醒 label:
For longer content, you can add a.text-truncate class to truncate the text with an ellipsis.
对于较长的内容,您可以添加 a.text-truncate class 以用省略号截断文本。 Requires display: inline-block or display: block.
需要 display: inline-block 或 display: block。
private void SetAlert(string message, string typeAlert)
{
AlertLB.Visible = true;
AlertLB.CssClass = "alert alert-" + typeAlert +" text-truncate";//added text-truncate
AlertLB.Text = message;
AlertLB.Focus();
}
Searching I found the following article that helped me find the solution:搜索我发现以下文章帮助我找到了解决方案:
https://asp-net-example.blogspot.com/2013/11/aspnet-example-label-ellipsis.html https://asp-net-example.blogspot.com/2013/11/aspnet-example-label-ellipsis.html
I added to my CSS code:我添加到我的 CSS 代码中:
<style type="text/css">
.LabelEllipsisStyle {
text-overflow:ellipsis;
white-space:nowrap;
display:block;
overflow:hidden;
}
</style>
I modified my Code Behind:我修改了后面的代码:
private void SetAlert(string message, string typeAlert)
{
AlertLB.Visible = true;
AlertLB.CssClass = "alert alert-" + typeAlert + " LabelEllipsisStyle";
AlertLB.Text = message ;
AlertLB.Focus();
}
The Solution:解决方案:
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.