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

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

本文关键字：网站 何使 Dropzone js 看起来      更新时间：2024-01-03

我一直在尝试使用一小段示例代码和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>

我检查了文件路径，这些都很好。最终结果看起来像http://www.dropzonejs.com/examples/simple.html但我的预期结果就像主页"试试看！"部分的例子。

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

对于主题本身，只要遵循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>

此外，请确保您的示例中有两个css文件

看小提琴：http://jsfiddle.net/jnoxvc7t/

相关文章：