如何將HTML添加到FineUploader中的qq-drop-area-text？

我想添加Font Awesome圖標和其他樣式（例如，<em>）到FineUploader的qq-drop-area-text。這可能嗎？它看起來像使用CSS content區域對文本進行了樣式設置。如何將HTML添加到FineUploader中的qq-drop-area-text？

例HTML從FineUploader：

<div class="qq-uploader-selector qq-uploader" qq-drop-area-text="Drop files here!">...</div>

期望：

<div class="qq-uploader-selector qq-uploader" qq-drop-area-text="<span class='fa fa-upload'></span> Drop files <em>here</em>!">...</div>

感謝

來源

2015-11-06 gregory

爲什麼你的建議標記不起作用？ –

@RayNicholus如果我使用HTML，則模板解析時，拖放區域爲空/空。如果我也在飛行中編輯演示，它不起作用。演示不會呈現HTML。 – gregory

.qq-uploader:before { 
    /*content: attr(qq-drop-area-text) " ";*/ 
    font-family: FontAwesome, 'Open Sans', Arial; 
    content: "\f0c5 Drop files here"; 
    position: absolute; 
    font-size: 200%; 
    left: 0; 
    width: 100%; 
    text-align: center; 
    top: 45%; 
    opacity: 0.25; 
}

下面是我的示例，其中f0c5是我想使用的Font Awesome圖標的Unicode值。在這種情況下，它是fa-files-o圖標。單擊Font Awesome list of icons上的任何圖標以顯示其Unicode值。

來源

2016-02-19 21:03:17 jrob007

偉大的解決方案！感謝您發佈此信息。 –

要更多的樣式添加到懸浮窗消息，簡單地包括以下在項目的CSS文件：

.qq-uploader:before { 
    // dropzone text styles go here 
}

來源

2015-11-06 18:14:26

不過，我的問題是將HTML添加到拖放區域。造型是沒關係的。 – gregory

您是否嘗試用自己的方式覆蓋現有的CSS樣式？ Fine Uploader不會阻止您將標記添加到文檔中。最有可能的是：風格之前，你的標記造成一些問題。我會建議覆蓋該規則。 –

如何將HTML添加到FineUploader中的qq-drop-area-text？

回答

相關問題