jquery - 如何使用 div 在另一个内部创建彩色矩形框我添加了下面的图片以显示我想要做的示例

Question

//我已经添加了下面的图片在此处输入图片描述

标签： jqueryhtmlcss

Answer 1

除了你需要使用 JavaScript 的边框颜色外，我认为这个片段几乎可以满足你的需要。

// random color
function cc () { return Math.round(Math.random() * 254); }
function color () {
  return "rgb(" + [ cc(), cc(), cc() ] + ")";
}

var main = document.getElementById("main");

main.style.borderColor = color();
while (main.firstElementChild) {
  main = main.firstElementChild;
  main.style.borderColor = color();
}

div {
  /* color omitted and it will assign with javascript */
  border: 1px solid;
}

#main { width: 400px; height: 600px; position: relative; }

div > div {
  width: 95%;
  height: 95%;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}

<!-- changed the "class" attribute as "id" -->
<div id="main">
  <div>
    <div>
      <div>
        <div>
          <div>
            <div>
              <div>
                <div></div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>