直播帶貨app原始碼，快應用richtext元件背景色填充問題
阿新 • • 發佈：2021-08-30
直播帶貨app原始碼，快應用richtext元件背景色填充問題
問題分析：
直播帶貨APP原始碼在使用richtext元件包裹html內容後，在快應用裡通過class設定background-color是不生效的。如果richtext包裹的內容只含網頁的body部分，即使在body上設定了背景色，在展示富文字時周圍也會出現一圈白色邊框。需要在richtext裡寫完整的html，且在其html標籤上設定背景色，背景色在展示時才能覆蓋邊框，不會出現白色的空隙。
解決方法：
在richtext裡包裹一個完整的html格式的網頁，html標籤中設定背景色。
<richtext type="html" class="rich-text">{{content}}</richtext> <script> export default { private: { content: `<!DOCTYPE html> <html lang="en" style="background-color: #006000;"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> </head> <body> <div class="item-content"> <style>h1{color: yellow;}</style> <p class="item-title">h1</p> <h1>文字測試</h1> <p class="item-title">h2</p> <h2>文字測試</h2> </div> </body> </html>` }, } </script> <style> .rich-text { background-color: #cd853f; }</style>
以上就是 直播帶貨app原始碼，快應用richtext元件背景色填充問題的相關程式碼，更多內容歡迎關注之後的文章