web-dev-qa-db-ja.com

Dropzone.jsをサイトのテーマのように表示するにはどうすればよいですか?

短いサンプルコードと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 のようになりますが、意図した結果はメインページ「TryIt!」の例のようになります。セクション。

あなたが助けることができるかどうか私に知らせてください。

8
user3288746

テーマ自体については、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/

11
jungy