Javascript 如何让 Dropzone.js 看起来像网站上的主题?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/28574594/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 02:01:50  来源:igfitidea点击:

How to make Dropzone.js appear like the theme on the site?

javascriptcssdropzone.js

提问by jungy

I've been trying to make Dropzone.js look like the theme on the site (dropzonejs.com) using a short piece of example code and dropzone.css. Here's my code:

我一直在尝试使用一小段示例代码和 dropzone.css 使 Dropzone.js 看起来像网站 (dropzonejs.com) 上的主题。这是我的代码:

<html>
<head>
<script src="dropzone.js"></script>
<link rel="stylesheet" type="text/css" href="dropzone.css">
<link rel="stylesheet" type="text/css" href="basic.css">
</head>
<form action="/upload-target" class="dropzone"></form>
</html>

I checked the file paths, and those are all good. The end result looks like http://www.dropzonejs.com/examples/simple.htmlbut my intended result is like the example on the main page "Try It!" section.

我检查了文件路径,这些都很好。最终结果看起来像 http://www.dropzonejs.com/examples/simple.html但我想要的结果就像主页上的例子“试试看!” 部分。

Let me know if you can help.

如果你能帮忙,请告诉我。

回答by jungy

For the theme itself, it seems to work fine as long as you follow the same structure in the cssrules: main section .dropzone.

对于主题本身,只要您在css规则中遵循相同的结构,它似乎就可以正常工作:main section .dropzone.

<html>
    <head>
        <link rel="stylesheet" href="dropzone.css">
        <link rel="stylesheet" href="style.css">
    </head>
    <body>
        <main>
            <section>
                 <h1 id="try-it-out">Try it out!</h1>

                <div id="dropzone">
                    <form action="" class="dropzone dz-clickable" id="demo-upload">
                        <div class="dz-message">Drop files here or click to upload.
                            <br> <span class="note">(This is just a demo dropzone. Selected files are <strong>not</strong> actually uploaded.)</span>

                        </div>
                    </form>
                </div>
            </section>
        </main>
    </body>
</html>

Also, make sure you have both cssfiles in your example

另外,请确保您css的示例中有两个文件

See the fiddle: http://jsfiddle.net/jnoxvc7t/

见小提琴:http: //jsfiddle.net/jnoxvc7t/