JavaScript改变了我的CSS

JavaScript changes up my CSS

本文关键字：CSS 我的 改变 JavaScript      更新时间：2023-09-26

我的html中有一些div框，它们的格式是我想要的。

每当我使用JavaScript改变其中一个框的值时，它就会改变格式。

为什么?我该如何阻止它呢?

document.getElementById("0").innerHTML = 20;
body {
  background-color: red;
  width: 1000px;
  margin: 10px;
}
#top {
  display: block;
  width: 200px;
  height: 100px;
}
#bottom {
  display: block;
  width: 200px;
  height: 100px;
}
.box {
  height: 94px;
  width: 96px;
  border: 1px solid white;
  display: inline-block;
}
<div id="board">
  <div class="row" id="top">
    <div class="box" id="0"></div>
    <div class="box" id="1"></div>
  </div>
  <div class="row" id="bottom">
    <div class="box" id="2"></div>
    <div class="box" id="3"></div>
  </div>
</div>

这是我的JSFiddle:

https://jsfiddle.net/pb4759jh68/arbsws5u/

在我的小提琴我有我的JavaScript语句活动，你可以把它注释出来，看看它对我的格式做了什么。

谢谢! !

这实际上不是JS，而是由于添加的内容。它们一开始是对齐的，因为没有内容，但一旦你添加了内容，它就会尝试将文本与下一个块的底部对齐。您可以通过设置:

来避免这种情况
vertical-align:top;
相关文章：