带有许多 div 的奇怪线条答案

【问题标题】：Strange lines with many divs带有许多 div 的奇怪线条
【发布时间】：2014-12-15 00:27:54
【问题描述】：

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

但是，我想知道我的网页背景中奇怪的白线是否有任何解决方案。我几乎 100% 确定我的 php 和 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;
}

【问题讨论】：

我想你可能忘了说问题是什么。

标签： php html css

【解决方案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>

【讨论】：

我会调查的。画布看起来就是我要找的东西。