Question

可以显示问题here。我正在尝试使用数千个固定的div框来创建随机生成的背景。我知道这对性能有很大影响。

但是，我想知道我的网页背景中是否有任何奇怪的白线解决方案。我几乎100％肯定我的php＆amp; css决定了盒子放在我的背景中的位置，但是，这里只是个案。

define('ROWS', 100);
define('COLUMNS', 100);


    $boxes = array();
    for($i = 0; $i < ROWS; $i++) {

        $boxes[] = array();
        for($j = 0; $j < COLUMNS; $j++) {
            $boxes[$i][$j] = randColor();

?>
#back<?php echo $i*COLUMNS + $j; ?> {
    background: #<?php echo $boxes[$i][$j]; ?>;
    width: <?php echo 100.0/COLUMNS ?>%;
    height: <?php echo 100.0/ROWS ?>%;
    left: <?php echo $j * 100.0/COLUMNS?>%;    
    top: <?php echo $i * 100.0/ROWS ?>%;
    position: fixed;
    z-index: -300;
}

Answer 1

尝试使用<canvas>并将画布分成碎片而不是div。它是HTML文件中的矩形区域，您可以在其中绘制任何内容，包括部件。

示例：画一个圆圈

的Javascript

var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.beginPath();
ctx.arc(95,50,40,0,2*Math.PI);
ctx.stroke();

HTML

<canvas id="myCanvas" width="200" height="100"
style="border:1px solid #000000;">
</canvas>

奇怪的线条与许多div

1 个答案: