div盒子内布局不随页面大小改变而改变，html该怎么实现

可以使用固定宽度和高度的方式来防止 div 盒子内布局随页面大小改变而改变。可以通过以下两种方式实现：

1. 使用固定像素值的宽度和高度

可以通过 CSS 中的 width 和 height 属性来设置固定像素值的宽度和高度。例如：

<div style="width: 300px; height: 200px;"></div>

这样在页面大小改变时，div 盒子的宽度和高度都会保持不变。

2. 使用固定的百分比值

可以通过 CSS 中的百分比值来设置固定的宽度和高度。例如：

<div style="width: 50%; height: 50%;"></div>

这样在页面大小改变时，div 盒子的宽度和高度会根据页面大小自适应调整，但是保持相对固定的比例。

需要注意的是，以上两种方式都可能会导致布局在不同分辨率的设备上出现问题，需要根据实际情况进行调整。同时，推荐使用响应式布局的方式来实现页面的适配。

相关问题

怎么实现当前点击的div样式改变，随点击的改变而改变

您可以使用JavaScript来实现这个功能。首先，给每个需要点击的div元素添加一个事件监听器，当点击时触发该事件。在事件处理函数中，可以使用`classList`属性来添加或删除CSS类，以改变样式。

以下是一个简单的例子:

HTML代码:

<div class="box"></div>
<div class="box"></div>
<div class="box"></div>

CSS代码:

.box {
  width: 50px;
  height: 50px;
  background-color: grey;
  margin: 10px;
  cursor: pointer;
}

.box.active {
  background-color: red;
}

JavaScript代码:

var boxes = document.querySelectorAll(".box");
for (var i = 0; i < boxes.length; i++) {
  boxes[i].addEventListener("click", function() {
    // 移除之前点击的元素的样式
    var activeBox = document.querySelector(".box.active");
    if (activeBox) {
      activeBox.classList.remove("active");
    }
    // 给当前点击的元素添加样式
    this.classList.add("active");
  });
}

在这个例子中，我们使用了`querySelectorAll`方法来获取所有的box元素，并给它们添加了一个`click`事件监听器。当点击一个box元素时，会触发事件处理函数，先移除之前点击的元素的样式，再给当前点击的元素添加样式。

CSS中的`.active`类定义了点击后的样式，通过`classList`属性的`add`和`remove`方法来动态改变元素的样式。

vue设置div位置不随页面大小变化

你可以通过设置该 div 的 CSS 样式来实现其位置不随页面大小变化。具体而言，你可以将该 div 的 position 属性设置为 fixed，然后通过 top、left、right、bottom 等属性来指定其在页面中的位置。例如：

#my-div {
  position: fixed;
  top: 100px;
  left: 50%;
  transform: translateX(-50%);
}

这段代码会将 id 为 my-div 的 div 固定在距离页面顶部 100px，距离页面左侧居中的位置，并且不会随着页面大小变化而改变位置。其中，transform: translateX(-50%) 是为了将该 div 水平居中，因为 left: 50% 只能将其左侧边缘居中。