简要咨询咨询QQ网站导航网站搜索手机站点联系我们设为首页加入收藏 

Html长文本超出标记宽度后自动截取实现代码

来源:易贤网   阅读:821 次  日期:2016-06-21 15:20:02

温馨提示:易贤网小编为您整理了“Html长文本超出标记宽度后自动截取实现代码”,方便广大网友查阅!

通过CSS去实现长文本自动截取功能,本人详细整理了一番,需要了解的朋友可以参考下

我们在显示长文本时,往往需要去在C#端去截取字符,但这绝对不是一个好方面,因为我们的长文本往往都是代HTML标记的,你一个载不好,就会出现乱码问题(出现半个HTML标记),而比较好的作法就是通过CSS去实现这个功能

span标签 当内容超出 强制不断行 自动换行

代码如下:

white-space:nowrap;white-space:norma;display:inline-block;

超出自动隐藏 英方不断行显示 (必须在块元素内)

代码如下:

overflow:hidden;white-space:nowrap;

而如果希望在文字后面加上个...,就可以使用text-overflow: ellipsis;一般的主流浏览器都支持这个属性

代码如下:

.tbconxx {

float: left;

width: 255px;

padding: 5px 10px;

}

.tbconxx li,tbconxx span {

padding-left: 7px;

text-overflow: ellipsis;

overflow: hidden;

display: block;

white-space: nowrap;

width: 240px;

}

这样就可以实现超过的文字自动隐藏的效果了。

更多信息请查看网页制作
点此处就本文及相关问题在本站进行非正式的简要咨询(便捷快速)】     【点此处查询各地各类考试咨询QQ号码及交流群
上一篇:HTML thead 标签定义和用法详细介绍
下一篇:html页!--[if IE]...![endif]--使用详细介绍
易贤网手机网站地址:Html长文本超出标记宽度后自动截取实现代码
由于各方面情况的不断调整与变化,易贤网提供的所有考试信息和咨询回复仅供参考,敬请考生以权威部门公布的正式信息和咨询为准!