`

css控制字符长度

CSS 
阅读更多

最近出差做个需要DIV+CSS布局的项目,才发现其中有很多问题需要解决。这里把一些问题记录下来,方便以后。

通常的我们在读取文章标题的时候,遇到字符过多,都是通过程序在SERVER端截取一定的字符数,然后添加…来实现标题长度截取的。其实我们也可以通过CSS来控制。

实列如下:

.title
{
 width:200px;
 white-space:nowrap;
 word-break:keep-all;
 overflow:hidden;
 text-overflow:ellipsis;
}

可用span或div引用,例如:

<span class=title>客户端解决标题显示太长省略多余部分并加省略号的样式</span> 
<div class=title>客户端解决标题显示太长省略多余部分并加省略号的样式</div> 

<style type="text/css"></style>

以上2例显示在超过样式定义的200px宽度后,后面的字符将被…替换.

分享到:
评论

相关推荐

    css控制td内容长度

    table中的内容经常超过了我们固定的td长度,这个css控制td的内容,如果超过了td长度则自动隐藏超过长度的字符,显示... 鼠标移过时,显示完整的td信息。

    CSS 控制标题长度,不再需要切字符串函数了 ^_^.txt

    CSS 控制标题长度,不再需要切字符串函数了 ^_^

    用css控制字符串的输出长度超出时隐藏

    用到了width、white-space:nowrap;overflow:hidden;text-overflow:ellipsis等属性,其中width就是指定的长度

    做网站可能用到的东西

    css控制字符长度要追加到目标中的内容IE和firefox通用的复制到剪贴板的JS函数

    CSS(js)限制页面显示的文本字符长度

    代码如下: ”cf_nav&gt; &lt;ul&gt; &lt;li&gt; &lt;a&gt; ”nav_block”&gt; 首页&lt;/span&gt; ”hover”&gt;首页&lt;/span&gt; &lt;/div&gt; &lt;/a&gt; &lt;/li&gt; &lt;li&gt; &lt;a&gt;

    JQuery&CSS;&CSS;+DIV实例大全.rar

    10.jQuery限制input或texteara字符输入限制字数控制插件下载 11.jQuery支持三级菜单的超酷华丽炫彩动感多级渐显菜单下载 12.jQuery制作登录按钮实现Ajax带状态提示 13.jvalidate无刷新表单验证插件示例下载 ...

    CSS通过letter-spacing属性 控制字与字间隔

    由于字符字形通常比其字符框要窄,指定长度值时,会调整字母之间通常的间隔。因此,normal 就相当于值为 0。 &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;Insert ...

    jQuery控制控件文本的长度的操作方法

    可能有的人会用Javascript中的substring对控件显示的文本进行控件,但由于字母大小写,汉字,其它语言等每个字符的大小是不一样的,这导致了同样是substring(0, 10),有的内容小,有的内容大,而想要使用CSS控制控件...

    自定义首页站外调用插件 for z-blog v1.8.rar

    只显示日志标题,并自动用CSS截取多余的字符长度,超链接在新窗口打开。用法很简单,把以下代码保存为一个新文件,然后上传到z-blog根目录,并在外部调用之,调用条数可以在z-blog后台修改,调用代码如下: [removed...

    超经典的Web前端与移动开发基础视频 Web前端基础开发视频教程 移动开发基础视频教程

    73前端开发基础视频-CSS长度单位表示.avi 74前端开发基础视频-关于像素的补充-CSS设置字体大小.avi 75前端开发基础视频-font-family设置字体类型.avi 76前端开发基础视频-font-family设置字体系列.avi 77前端...

    css 网页虚线制作方法剖析

     (4)定义画笔—描边路径,和第一种方法相似,但是控制虚线单元的长度。 (5)直接从满意的网页上截取(汗..以前图省事经常这么干..),因为只是出效果,具体在后面的制作中,你绘制的虚线再完美

    dreamweaver网站PHP开发MXP插件

    限制文本框内字符长度插件.mxp 新闻点击数记录.mxp 新增14个框架组合插件.mxp 颜色渐变的文字.mxp 页面载入效果插件.mxp 隐藏替换无法显示图片插件.mxp 在线播放媒体插件.mxp 站点计数器插件.mxp 指定页面前进后退...

    BIWEB WMS PHP开源企业建站系统 v5.8.5.rar

    在check类中新增去除HTML格式截取指定长度的字符串函数substring。 20.smarty升级到2.6.26版本。 21.修改了底层的getRoueList可以按照路由取回类型ID和TITLE。 22.修改了底层共享内存模块针对PHP5.3以上版本的错误...

    XML实用大全(web开发必备手册)

    13.1.6 可视格式化控制... 391 13.1.7 表格... 391 13.1.8 生成的内容... 391 13.1.9 有声样式单... 391 13.1.10 新工具... 391 13.2 选择元素... 393 13.2.1 式样匹配... 393 13.2.2 通配符... 394 13.2.3 ...

    sunday.github.io

    字符串前“ ABC 0 1 2” '23 -23' 布尔值,正确与错误 功能 将C转换为F。 转换USD到BATH 转换cm至m 转换厘米到英寸 通过获取长度和宽度来找到矩形的面积。 状况 ... 笔记 编译JS =&gt;节点index.js方法 第3节 ...

    PHP开发实战1200例源码

    实例093 统计帖子标题的长度 127 实例094 计算论坛帖子的字节数 128 实例095 实现帖子内容的定位查找 129 实例096 去除帖子标题的首尾空格 129 实例097 货币数据的格式化输出 130 实例098 日期、时间的格式化输出 ...

    PHP开发实战1200例(第1卷).(清华出版.潘凯华.刘中华).part1

    实例093 统计帖子标题的长度 127 实例094 计算论坛帖子的字节数 128 实例095 实现帖子内容的定位查找 129 实例096 去除帖子标题的首尾空格 129 实例097 货币数据的格式化输出 130 实例098 日期、时间的格式化输出 ...

    PHP开发实战1200例(第1卷).(清华出版.潘凯华.刘中华).part2

    实例093 统计帖子标题的长度 127 实例094 计算论坛帖子的字节数 128 实例095 实现帖子内容的定位查找 129 实例096 去除帖子标题的首尾空格 129 实例097 货币数据的格式化输出 130 实例098 日期、时间的格式化输出 ...

Global site tag (gtag.js) - Google Analytics