ant-mobile的Toast的樣式修改(react)


 

 

最近使用了ant-mobile來作為項目的UI框架。

項目中,點擊列表的時候回出現一個提示,這個提示是ant-mobile自帶的toast,我們可以直接調用。

toast的提示很多的,我這里只是用的toast.info。

最開始的時候,是這樣的。

 

根據項目的設計UI需要修改其樣式,因為這個toast是動態添加,並且會馬上消失的,所以頁面中根本找不到這個元素。

絞盡腦汁后,突然想到,toast中設置了消失的延時。那我設置長一點,應該就可以在它消失前看到這個元素了。

試了一下,將時間設置為10秒。

 

 

找到了他的名字,叫am-toast-text,我試了給它設置兩個屬性。

 

 

但是,樣式卻沒有成為我想要的背景透明。邊框倒是加上了。

 

 

原來他已經有的屬性,沒有改變,沒有的屬性,是加上了的。要想改變其已有屬性,得另想辦法了。

突然想起CSS中有個叫important的,級別好像是最高。我試了一下。樣式就變成了下面這樣。

 

還真的是有用呢,開心~~~~~~~~~~~

emmmm,方法已經找到了,先記錄一下,我要開始改變其樣式了。有什么節外生枝的,完了再來補充~~~~~~~~~~~

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM