react实现多行文本超出加省略号
http://www.css88.com/archives/5206
overflow : hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
根据该文章方法,放在react项目中发现并不能实现,仔细观察发现原来react解析出来的css样式中没有了 这个样式 :
-webkit-box-orient: vertical; 所以我们需要在需要超出加省略号的标签上加一个行内样式:
<p className="right-margin-12 color-8 author-intro" style={{"WebkitBoxOrient": "vertical"}}>{news.pubInfo.introduction}</p>

然后即可实现。
react实现多行文本超出加省略号的更多相关文章
- html文本超出加省略号
如果实现单行文本的溢出显示省略号同学们应该都知道用text-overflow:ellipsis属性来,当然还需要加宽度width属来兼容部分浏览. 实现方法: overflow: hidden; te ...
- css实现单行、多行文本超出显示省略号
前言:项目中我们经常遇到这种需求,需要对单行.多行文本超出显示为省略号.这篇文章主要总结了小编解决此问题的方法,有不足之处欢迎大家指正. 单行文本省略 .ellipsis-line { border: ...
- css控制单行或者多行文本超出显示省略号
1.单行文本 使用text-overflow:ellipsis属性 text-overflow: clip|ellipsis|string; clip:修剪文本. ellipsis:显示省略符号来代表 ...
- Android判断TextView是否超出加省略号
我们都知道通过指定android:ellipsize="end" android:singleLine="true" 可以让TextView自动截断超出部分并且 ...
- 微信小程序文字超出加省略号
我查资料的时候搜到这个博客 http://blog.csdn.net/u010168409/article/details/54429678 view{ overflow:hidden; //超出一行 ...
- CSS实现单行、多行文本超出部分显示省略号
单行文本超出,代码如下: css代码: <style> .one{ width:200px; overflow: hidden; text-overflow:ellipsis; whit ...
- 多行文本溢出显示省略号(…) text-overflow: ellipsis
详解text-overflow 语法: text-overflow:clip | ellipsis 默认值:clip 适用于:块级容器元素 继承性:无 动画性:否 计算值:指定值 取值: clip:当 ...
- CSS实现单行、多行文本溢出显示省略号(…)
如果实现单行文本的溢出显示省略号同学们应该都知道用text-overflow:ellipsis属性来,当然还需要加宽度width属来兼容部分浏览. 实现方法: overflow: hidden; te ...
- CSS和JS实现单行、多行文本溢出显示省略号(该js方法有问题不对)
如果实现单行文本的溢出显示省略号同学们应该都知道用text-overflow:ellipsis属性来,当然还需要加宽度width属来兼容部分浏览. 实现方法: overflow: hidden; te ...
随机推荐
- git 删除分支 远程 && 本地
//查看远程分支 git branch -a //删除远程分支 git branch -r -d origin/branch-name git push origin :branch-name// 或 ...
- CocosCreator 场景转换API
一.CocosCreator场景的切换API: cc.director.loadScene( ‘场景名称’);//场景切换必须使用的API 通过场景名称进行加载场景时,常用的就是上边的API,但是版本 ...
- CentOS下bond网卡聚合与网桥结合
需求:服务器配置bond多网卡聚合,然后KVM需要使用到网桥,那么需要做到网桥绑定到bond网卡上. 实现核心: 1.bond配置参考:https://www.cnblogs.com/EasonJim ...
- SSH使用自定义私钥进行登录
ssh -i /root/.ssh/id_rsa root@192.168.1.2 -i指定了私钥文件的路径
- [Beego模型] 一、ORM 使用方法
[Beego模型] 一.ORM 使用方法 [Beego模型] 二.CRUD 操作 [Beego模型] 三.高级查询 [Beego模型] 四.使用SQL语句进行查询 [Beego模型] 五.构造查询 [ ...
- Windows下的搜索神器 —— everything
介绍一款Windows下的神奇 -- everything,软件很小巧,但是搜索速度非常快,比Windows自带的搜索功能更强大.更快.掌握它的基本用法,在查找文件时能提升很高的效率 1.下载 2.基 ...
- 【.NET线程--进阶(一)】--线程方法详解
上篇博客从线程的基本概况开始着重讨论了线程,进程,程序之间的区别,然后讨论了线程操作的几个类,并通过实例来说明了线程的创建方法.本篇博客将会带大家更深入的了解线程,介绍线程的基本方法,并通过一个Dem ...
- 细说firewalld和iptables
在RHEL7里有几种防火墙共存:firewalld.iptables.ebtables,默认是使用firewalld来管理netfilter子系统,不过底层调用的命令仍然是iptables等. fir ...
- PowerShell使用ServicePrincipal登陆Azure
一.打开PowerShell 二.输入下列命令 $pass = ConvertTo-SecureString "<这里换成您的AAD应用密钥>" -AsPlainTex ...
- 一文看懂 Dubbo 的集成与使用
前言 今年年初时,阿里巴巴开源的高性能服务框架dubbo又开始了新一轮的更新,还加入了Apache孵化器.原先项目使用了spring cloud之后,已经比较少用dubbo.目前又抽调回原来的行业应用 ...