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>

然后即可實現。

?

本文轉載于:猿2048?https://www.mk2048.com/blog/blog.php?id=hc2jkaa&title=react實現多行文本超出加省略號

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/370767.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/370767.shtml
英文地址,請注明出處:http://en.pswp.cn/news/370767.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

Google Guava MultiMaps

番石榴 這是系列文章中的第一篇&#xff0c;我將嘗試解釋和探索Google很棒的Guava java庫 。 我在搜索Apache Commons Collections的通用版本時遇到了番石榴&#xff08;Guava&#xff09;–我需要一個Bimap并且厭倦了必須使用強制類型轉換來填充我的代碼–但是我發現要好得多…

qq群 html,我的群組-普通群組.html

&#xfeff;我的群組&#xff0d;普通群組$axure.utils.getTransparentGifPath function() { return resources/images/transparent.gif; };$axure.utils.getOtherPath function() { return resources/Other.html; };$axure.utils.getReloadPath function() { return resou…

查看PLC IP 端口_西門子828D數控系統X130接口通訊怪異現象(X130手動設置的 IP)...

西門子828D數控系統&#xff0c;調試PLC過程中遇到網絡通信怪異問題(不能直連非要加個路由器)&#xff0c;筆記本電腦的以太網網絡直接連接顯示網絡電纜被拔出&#xff0c;如下圖所示&#xff1a;奇怪&#xff0c;怎么出現這種情況了呢&#xff0c;因為我用這臺電腦調試過別的P…

基于嵌入式系統的gnash最小庫依賴關系

已經對gnash的依賴庫作了詳細的分析&#xff0c;下邊是必須依賴的庫&#xff1a;GIF Required libungif-devlibxml2 Required libxml2-devPNG Requir…

git 創建webpack項目_一次create-react-app創建項目升級webpack的流水賬

不再贅述為什么要升級webpack4&#xff0c;有興趣的小伙伴可以看一下 知乎&#xff1a;如何評價webpack4下面擼起袖子開干&#xff1a;克隆項目&#xff0c;新建分支git checkout -b feature_webpack_upgrade# 相當于以下兩句的簡寫git branch feature_webpack_upgradegit chec…

bzoj1263

貪心 n%31 分出一個4&#xff0c;其余用3&#xff0c;n%32&#xff0c;分出一個2&#xff0c;其余用3&#xff0c;然后高精度就行了 #include<bits/stdc.h> using namespace std; const int N 5005; struct BigInt {int len;int a[N];BigInt() { memset(a, 0, sizeof(a)…

c語言volatile_[技術]為什么單片機C語言編程時某一變量有時亂碼

最近一個項目里面&#xff0c;在KEIL中用C語言在單片機里面定義了一個狀態機全局變量&#xff0c;這個變量隨時會改變&#xff0c;用于切換觸摸屏的界面&#xff0c;可是程序運行中出現了一個問題&#xff0c;這個狀態機號總是出現了被莫名奇妙改變的問題&#xff0c;導致觸屏不…

沙箱Java代碼

在上一篇文章中&#xff0c;我們研究了如何保護移動Java代碼 。 這樣做的一種選擇是在籠子或沙箱中運行代碼。 這篇文章探討了如何為Java應用程序設置這樣的沙箱。 安全經理 Java中支持沙箱的安全性設施是java.lang.SecurityManager 。 默認情況下&#xff0c;Java在沒有Se…

微型計算機2017年9月上,2017年9月計算機一級考試WPS Office沖刺題

2017年9月計算機一級考試WPS Office沖刺題2017年下半年計算機一級考試將在9月份進行&#xff0c;為了方便考生備考計算機一級考試。下面是小編為大家帶來的計算機一級考試WPS Office沖刺題&#xff0c;歡迎閱讀。沖刺題一&#xff1a;1、PowerPoint 演示文稿和模板的擴展名是【…

七. 多線程編程5.創建多線程

到目前為止&#xff0c;我們僅用到兩個線程&#xff1a;主線程和一個子線程。然而&#xff0c;你的程序可以創建所需的更多線程。例如&#xff0c;下面的程序創建了三個子線程&#xff1a;// Create multiple threads.class NewThread implements Runnable { String name; /…

11尺寸長寬 iphone_弱電工程LED顯示屏尺寸規格及計算方法

前言&#xff1a;led屏幕在生活中&#xff0c;隨處可見&#xff0c;顯示屏、廣播屏等等&#xff0c;但是led尺寸怎么計算的&#xff0c;你知道嗎&#xff1f;今天我們一起了解一下led屏幕尺寸的計算方法。正文&#xff1a;一、點間距的計算1、各單元板常見型號及尺寸LED屏普遍是…

marquee標簽的使用

<!DOCTYPE html> <html> <head><meta charset"utf-8" /><title>演示marquee</title><style type"text/css">*{padding: 0px;margin: 0px;}marquee{border: 1px solid purple;}img{width: 360px;height: auto;}&…

32位數據源中沒有mysql_[SpringBoot實戰]快速配置多數據源(整合MyBatis)

前言由于業務需求&#xff0c;需要同時在SpringBoot中配置兩套數據源&#xff08;連接兩個數據庫&#xff09;&#xff0c;要求能做到service層在調用各數據庫表的mapper時能夠自動切換數據源&#xff0c;也就是mapper自動訪問正確的數據庫。本文內容&#xff1a;在SpringbootM…

考研計算機冷門學校,考研5個冷門的985院校 別隨大流,這些幾所也是很不錯的...

導語&#xff1a;想必大家考研的目的有很多&#xff0c;最主要的就是想去更好的學校提升自己&#xff0c;大部分會肯定是會更傾向于985這類的院校&#xff0c;每年其實除了那些被“擠破頭”的985院校&#xff0c;其實還有不少“低調”的985院校是非常值得報考的&#xff0c;下面…

名為 cursor_jinserted 的游標不存在_質量工程師必須了解的測量常識,你不知道怎么行...

01測量器具的分類測量器具是一種具有固定形態、用以復現或提供一個或多個已知量值的器具。按用途的不同量具可分為以下幾類&#xff1a;1. 單值量具只能體現一個單一量值的量具。可用來校對和調整其它測量器具或作為標準量與被測量直接進行比較&#xff0c;如量塊、角度量塊等。…

window.onload事件

!DOCTYPE html> <html> <head lang"en"><meta charset"UTF-8"><title>window.onload</title><!--window.onload注意點&#xff1a;01.在整個頁面中只能存在一次&#xff0c;否則后面會覆蓋前面02.頁面中所有的內容加載…

bzoj4869

http://www.lydsy.com/JudgeOnline/problem.php?id4869 終于A了。。。參考了下dalao的代碼。。。 拓展歐幾里得定理&#xff0c;改了幾次就不變了&#xff0c;但是用的時候要在快速冪里判是不是要用。 #include<bits/stdc.h> using namespace std; typedef long long ll…

一張圖一個表——CSS選擇器總結

CSS選擇器總結&#xff1a; (這些表是一張圖片^_^) 看底部 完整思維導圖圖片和表格的下載地址&#xff1a;https://download.csdn.net/download/denlnyyr/10597820 &#xff08;我不想選擇要積分幣下載的&#xff0c;但那里最低必須選擇1個積分……&#xff09; 參考文獻&…

JavaOne 2012覆蓋率

年度Java盛會JavaOne會議于9月30日至10月4日在舊金山舉行。 進行了許多有趣的演示&#xff0c;再次證明了健康的Java生態系統。 Java Code Geeks未能參加會議&#xff0c;但是我們的JCG合作伙伴Dustin Marx出席了會議&#xff0c;并且慷慨地提供了有關該事件的完整報道&#x…

native層 安卓_安卓逆向——拼xx協議java層分析

制丨阿星整理丨阿星老鐵們大家好&#xff0c;今天小編給大家帶來很實用的技巧叫拼xx協議java層分析&#xff0c;有啥不足的地方望大家指點指點&#xff01;首先抓包 反編譯這個時間段我們方法剖析一下找到onclick 看他的走向找到方法的地方都是在進行寫入 所以我們直接分析結果…