1

ホームページhttp://geotheory.co.uk/をインタラクティブなアニメーションでカスタマイズしていますが、ページ内で見栄えが悪くなるのに問題があります。アニメーション化されたキャンバスオブジェクトの境界線を削除したいのですが、これにより不要なスクロールバーが作成されます。私は、などのさまざまなスタイルオプションを試しましたが、運がborderありpaddingませんでした。アニメーションは処理スクリプトであり、JavaScriptに変換されます。index.htmlには次のように書かれています。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>geotheory.co.uk</title>
    <style>
        canvas:focus{outline:none;}
    </style>

</head>
<body  id="home" bgcolor="blue">
    <script src="processing-1.4.1.min.js"></script>
    <div id="canvasContainer">
    <canvas data-processing-sources="rectangles.pde"></canvas>
    </div>
</body>

支援に感謝します。

4

2 に答える 2

8

ブラウザのデフォルトスタイルをリセットしていないと思います...したがって、デフォルトスタイルをリセットする必要があります。これを使用してください

* {
   margin: 0;
   padding: 0;
}

説明：ブラウザはいくつかの要素にパディングとマージンを与えるので、それらをリセットするには、CSSリセットを使用することもできると私が言ったスタイルを使用する必要があります

また、 （Kolinkが言ったように）にも使用display: block;します<canvas>

于 2012-12-26T15:59:03.033 に答える
7

cssのタグとcssのタグに追加margin: 0;します。bodydisplay: block;canvas

例：

canvas {
    display:block;
}

body {
    margin:0;
}
于 2012-12-26T15:59:00.727 に答える