css文本截字,超出文本省略号显示
一、单行文本截字
p {
text-overflow: ellipsis;/*显示省略号代替裁剪的文本*/
white-space: nowrap;/*空白处理方式 不换行*/
overflow: hidden;/*溢出隐藏*/
}
效果:
二、多行文本截字
p{
display:-webkit-box;/*设置盒子为弹性盒容器*/
-webkit-box-orient:vertical;/*设置盒子内部排列方式为垂直排列*/
-webkit-line-clamp:;/*显示两行*/
text-overflow:ellipsis;/*用省略号代替才建的文字*/
overflow:hidden;/*溢出隐藏*/
/*若为纯字母、数字,需要加上下面这句*/
word-break:break-all;
}
效果
css文本截字,超出文本省略号显示的更多相关文章
- android开发之当设置textview多少字后以省略号显示。限制TextView的字数
设置多少字后以省略号显示 <TextView android:id="@+id/tv" android:layout_width="wrap_conten ...
- css实现文本超出部分省略号显示
一般超出文本显示分为两种:单行超出文本和多行超出文本省略号显示,实现方式使用纯css实现: div { // 单行 white-space: nowrap; overflow: hidden; tex ...
- 翻译:如何使用CSS实现多行文本的省略号显示
本文翻译自CSS Ellipsis: How to Manage Multi-Line Ellipsis in Pure CSS,文中某些部分有些许改动,并添加译者的一些感想,请各位读者谅解. 合理的 ...
- CSS文本单行或者多行超出区域省略号(...)显示方法
单行超出时,主要用到几个CSS属性: 1.text-overflow : clip | ellipsis ; clip : 不显示省略标记(...),而是简单的裁切ellipsis : 当对象内文本溢 ...
- 文本太长,用省略号显示的css样式
——html代码 <divid="d1" title="鼠标放上显示的文字"></div> ——css代码 #d1{ width:300 ...
- CSS div内文字显示两行,超出部分省略号显示
1. 概述 1.1 说明 在项目过程中,有时候需要控制div内文字最多显示两行,超出的使用省略号进行处理.使用识别码/前缀-webkit进行处理可直接得到相应效果. 1.1 -webkit WebKi ...
- css 文字展示两行 其余的省略号显示
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- HTML5--div、span超出部分省略号显示
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 微信小程序 实现多行文字 超出部分省略号显示
在开发小程序: 澳买 的 时候 遇到一个棘手的问题: 当搜索澳洲产品,获取产品列表的时候,有时候产品的名称翻译成中文特别长 我们不能全部在有限的列表里面把产品名都显示出来,这样格式不好控制,显示 出来 ...
随机推荐
- pdf2swf 转换时报错。This file is too complex to render- SWF only supports 65536 shapes at once
在使用swftools转换pdf 到swf的时候报错,有如下说明:if the pdf contains too many images / shapes, pdf2swf will fail wit ...
- oracle数据库建表设置自增主键
create sequence userlogin_ID increment by 1 start with 1 minvalue 1 maxvalue 9999999999999999 nocach ...
- pringMvc-使用原生api
在springMvc有时候需要使用原生的api: @RequestMapping(value="/testApi") public String testApi(HttpServl ...
- css3 兼容性
为了准确快速的知道css3对浏览器的兼容性(这里主要针对ie), 做了一个简单的表格
- 【2017-06-06】Qt中的键盘事件:QKeyEvent及相关处理函数
QKeyEvent及其相关的处理函数,比如QKeyPressEvent.QKeyReleaseEvent()等在QtGui编程中非常常用,尤其是需要借助标准键盘的编码来实现一些自定义功能的时候. 这算 ...
- NO.004-2018.02.09《离思五首·其四》唐代:元稹
离思五首·其四_古诗文网 离思五首·其四 唐代:元稹 曾经沧海难为水,除却巫山不是云.曾经到临过沧海,别处的水就不足为顾:除了巫山,别处的云便不称其为云.曾经:曾经到临.经:经临,经过.难为:这里指“ ...
- PythonTip(1)
发现一个Python的题库,嘿嘿,练练手吧~~~ http://www.pythontip.com/ a + b 描述: 给你两个数a.b,请你计算它们的和,并输出. 例如: a = 3, b = 2 ...
- Struts2学习笔记——Struts2搭建和第一个小程序
1.新建web项目 2.配置Struts2核心过滤器 (1)打开web.xml文件,做以下配置: <?xml version="1.0" encoding="UTF ...
- 转载 【MySql】Update批量更新与批量更新多条记录的不同值实现方法
批量更新 mysql更新语句很简单,更新一条数据的某个字段,一般这样写: UPDATE mytable SET myfield = 'value' WHERE other_field = 'other ...
- php如何实现登陆后返回原页面
访问网站页面时,有的页面需要授权才能访问,这时候就会要求用户登录,跳转到登录页面login.php,怎么实现登录后返回到刚才访问的页面项目需求 访问网站页面时,有的页面需要授权才能访问,这时候就会要求 ...