（37分）在页面中浮动显示一个矩形的div盒子，位置在整个页面内随机运动。矩形框内显示以下3条信息： “HTML中层的应用”、“CSS样式表的应用”和“JavaScript常用对象” ，并分别链接到对应的HTML文件。点击这些链接，在新页面中显示相应的内容的简单介绍； （10分）鼠标移到div盒子上方时，div盒子停止运动，移出时继续运动。 （53分）在页面中展示div盒子的属性设置，包括：(1) DIV盒子的宽度和高度（单位：px）；（2）DIV盒子的边框样式（图像按扭或下拉列表框）；（3）显示的内容；（4）DIV盒子的背景和前景色。 并可以重新设置这些属性（其中边框样式使用图像按扭或下拉列表框列出边框线条样式进行设置、其他属性的设置方式不进行限制） 点击相应设置，设置同时生效。

好的，这是一个比较复杂的问题，需要分步骤来回答。

首先，实现一个页面中浮动显示一个矩形的div盒子，位置在整个页面内随机运动，可以使用JavaScript来实现。我们可以先用CSS将这个矩形div盒子设置为浮动和绝对定位，然后用JavaScript随机生成left和top的值，实现随机运动的效果。以下是代码示例：

HTML代码：

<div id="box">HTML中层的应用<br>CSS样式表的应用<br>JavaScript常用对象</div>

CSS代码：

#box {
  position: absolute;
  float: left;
  width: 200px;
  height: 200px;
  background-color: #ccc;
  border: 1px solid #000;
  text-align: center;
  padding-top: 80px;
  cursor: pointer;
}

JavaScript代码：

var box = document.getElementById("box");
var maxWidth = window.innerWidth - 200;
var maxHeight = window.innerHeight - 200;

function moveBox() {
  var left = Math.floor(Math.random() * maxWidth);
  var top = Math.floor(Math.random() * maxHeight);
  box.style.left = left + "px";
  box.style.top = top + "px";
}

setInterval(moveBox, 1000);

接下来，实现鼠标移到div盒子上方时，div盒子停止运动，移出时继续运动。可以使用JavaScript的事件监听器来实现。以下是代码示例：

box.addEventListener("mouseover", function() {
  clearInterval(boxInterval);
});

box.addEventListener("mouseout", function() {
  boxInterval = setInterval(moveBox, 1000);
});

然后，展示div盒子的属性设置，包括DIV盒子的宽度和高度、DIV盒子的边框样式、显示的内容、DIV盒子的背景和前景色。可以使用HTML的表单元素来实现。以下是代码示例：

<div>
  <label for="width">宽度：</label>
  <input type="text" id="width" value="200"> px
</div>
<div>
  <label for="height">高度：</label>
  <input type="text" id="height" value="200"> px
</div>
<div>
  <label for="border-style">边框样式：</label>
  <select id="border-style">
    <option value="solid">实线</option>
    <option value="dashed">虚线</option>
    <option value="dotted">点线</option>
  </select>
</div>
<div>
  <label for="content">显示的内容：</label>
  <input type="text" id="content" value="HTML中层的应用<br>CSS样式表的应用<br>JavaScript常用对象">
</div>
<div>
  <label for="background-color">背景色：</label>
  <input type="color" id="background-color" value="#ccc">
</div>
<div>
  <label for="color">前景色：</label>
  <input type="color" id="color" value="#000">
</div>
<div>
  <button id="reset">重置</button>
</div>

最后，实现重新设置这些属性的功能，可以使用JavaScript的事件监听器来实现。以下是代码示例：

var widthInput = document.getElementById("width");
var heightInput = document.getElementById("height");
var borderStyleSelect = document.getElementById("border-style");
var contentInput = document.getElementById("content");
var backgroundColorInput = document.getElementById("background-color");
var colorInput = document.getElementById("color");
var resetButton = document.getElementById("reset");

resetButton.addEventListener("click", function() {
  box.style.width = widthInput.value + "px";
  box.style.height = heightInput.value + "px";
  box.style.borderStyle = borderStyleSelect.value;
  box.innerHTML = contentInput.value;
  box.style.backgroundColor = backgroundColorInput.value;
  box.style.color = colorInput.value;
});

以上就是实现页面中浮动显示一个矩形的div盒子，位置在整个页面内随机运动，并且实现鼠标移到div盒子上方时，div盒子停止运动，移出时继续运动，并且展示div盒子的属性设置，包括DIV盒子的宽度和高度、DIV盒子的边框样式、显示的内容、DIV盒子的背景和前景色，并且可以重新设置这些属性的功能的完整代码。