CSS控制标题字符长度多余部分用省略号表示

代码如下	复制代码
<style type="text/css"> .abc { background-color: #CCC; width: 200px; overflow:hidden; text-overflow:ellipsis;/文字溢出的部分隐藏并用省略号代替/ white-space:nowrap;/文本不自动换行/ </style> <div class="abc">我是标题，我很长，很长，真的很长，已经长的令人无法接受了！！！

时间： 2024-09-29 19:30:13

CSS控制标题字符长度多余部分用省略号表示的相关文章

用css控制标题字符溢出,用省略号表示

css控制文章列表,让标题溢出的文字以省略号方式表现. <div style="width:300px; height:22px;line-height:22px; white-space: nowrap;text-overflow:ellipsis; overflow:hidden;">测试一下效果看能不能达到只逼供逼供逼供逼供珍贵逼供蚶见多识广薯在时工楞革革工进而杳碴国圆顶 </div> 用上面这段代码就可以实现,但如果要实现效果就得结合多个css的定义才

destoon 控制标题长度,title中显示全标题

<!--{tag("moduleid=5&length=36&condition=status=3 and level>0 and thumb<>''&areaid=$cityid&pagesize=".$DT['page_sell']."&order=addtime desc&width=100&height=100&cols=5&target=_blank&lazy=$

JS和CSS限制页面显示的字符长度

<nav class="cf_nav clearfix"> <ul> <li> <a href="http://lizhuangs.18021051d350c3871c0a.tpl.diandian.com" title="首页"> <div class="nav_block"> <span>首页</span> <span class=&

CSS控制字体效果的思考

css|控制字体的处理在网页设计中无论怎么强调也不为过,毕竟网页使用来传递信息的,而最经典最直接的信息传递方式就是文字,所以,了解一点字体的基本知识对于设计来说还是非常重要的. 中文和英文的最大区别就是中文是方块字,英文是拼音文字,这对字体的处理的影响是巨大的.看看下面的图示就会发现,英文字体里的那些变化在中文字体里都弱化了. 作为中文的读者,习惯性的接受方块形状做为阅读的单元,其实对于眼睛来说,这是一种容易疲劳的方式,阅读的时候你的视线实际上是跟随整行文字的外形.看看这个例子. NOW I'

CSS控制省略号方式显示（IE、FF）

文章提供三种关于文章标题过长了,控制显示为略号方法,下面有三款css教程控制省略号方式显示(ie.ff)代码,后两款都兼容ie,firefox. div{ width:200px;/*容器的基本定义*/ height:200px; background-color:#eee; } /* ie下的样式 */ p span{ display: block; width:200px;/*对宽度的定义,根据情况修改*/ overflow: hidden; white-space: nowrap; tex

CSS控制的内容超过容器宽度后显示省略号

css|控制|显示一般我们看到的比如新闻列表,为了使文字不回行,控制字数,会通过程序让多余的字符显示省略号,我们只使用CSS可以达到同样的效果,虽然不完美. li { width:50px; white-space:nowrap; text-overflow:ellipsis; overflow: hidden; } 首先是一个容器,可以是div,li,td等等,先定义宽度,"white-space:nowrap"是强制在一行内显示所有文本,不回行.&q

网页制作中应用CSS控制文本的主要指令

css|控制|网页本章CSS的主要作用本章要介绍的是文字相关的CSS指令.通常一个网站的内容最多的就是文字了,透过这些文字相关的CSS指令,您可以将您的网页内容排版得美美的.本章将分两个部份为您介绍,第一部份是字型性质的CSS指令,用以控制文字字型的各种样式:第二部份介绍的是文字性质的CSS指令,用以控制文字段落的外观及摆设方式. 字型性质的CSS指令 font-family 设定文字字型支持:IE3.IE4适用:所有元素可能值: <family-name> 字型名称预设值

css控制不同段落出现不同的效果

css控制不同段落出现不同的效果,即对同一种html元素分类: html页面内容: <html> <head> <title>对同一种html元素分类</title> <link rel="stylesheet" type="text/css" href="test.css" /> </head> <body> <p class="cls1&quo

用css控制html中首行空两格

利用css 来进行首行缩进,非常的方便. 将文章内容用p标签包住,然后对<p>标签添加样式即可实例: <div class="context"><p>第一段</p><p> 第二段</p></div> 那么我们就在css里添加样式 .context p{ text-align: justify; text-justify: inter-ideograph; text-indent: 2em;