简体   繁体   English

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

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

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. 我一直试图使用一小段示例代码和dropzone.css使Dropzone.js看起来像网站上的主题(dropzonejs.com)。 Here's my code: 这是我的代码:

<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.html but my intended result is like the example on the main page "Try It!" 最终结果看起来像http://www.dropzonejs.com/examples/simple.html但我的预期结果就像主页“试一试”中的示例一样。 section. 部分。

Let me know if you can help. 如果你能提供帮助,请告诉我。

For the theme itself, it seems to work fine as long as you follow the same structure in the css rules: 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 css files in your example 另外,请确保您的示例中同时包含两个css文件

See the fiddle: http://jsfiddle.net/jnoxvc7t/ 看小提琴: http//jsfiddle.net/jnoxvc7t/

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM