Question

我正在制作文本浏览器RPG，并且我在页面底部有输入表单。当我在游戏中添加文字时，这个表格就会向下移动。如何防止这种情况并将其固定在某个位置，以便在我向页面添加内容时它不会移动？

＆＃13;

html {
  border: 1px solid;
  height: 550px;
}
hr {
  display: block;
  border: 0;
  border-top: 1px solid #000;
}
.input {
  margin-top: 390px;
}

＆＃13;

<hr>
    <body>
      <p>No text.</p>
	  <div class="input"><input type="text" name="input" size="179" padding-top="333px">
	  <input type="submit" value="Submit"></div>
    </body>

＆＃13;

Answer 1

只需删除填充顶部，
试试吧
@Entity @Inheritance(strategy=InheritanceType.JOINED) public class Fish { @Id @GeneratedValue private Long id; private String name; private Integer numOfFins; private String color; @ManyToOne @JoinColumn private Environment environment; @OneToMany @JoinColumn private String parts } @Entity public class EndangeredFish extends Fish { Integer numOfFishLeft; }

我想它会准备好的。或者只是尝试使用position：fixed。

Answer 2

如果您不打算滚动，可以给它一个固定的位置。无论您是否滚动，这都会使您的元素位于视口中的相同位置。

position: fixed;

您还可以使用绝对位置，以使您的元素位置不会对页面上的任何其他元素做出反应。

position: absolute;

然后，您必须使用top：#px手动定位元素，将元素向下移动到所需位置。

Answer 3

您可以执行以下操作，定义“消息”的高度，而不是在输入中添加边距，并在必要时添加垂直滚动条。

html {
  border: 1px solid;
  height: 550px;
}
hr {
  display: block;
  border: 0;
  border-top: 1px solid #000;
}
.messages {
  height: 390px;
  overflow-y: auto;
}

<hr>
    <body>
      <div class="messages"><p>No text.</p></div>
	  <div class="input"><input type="text" name="input" size="179" padding-top="333px">
	  <input type="submit" value="Submit"></div>
    </body>

添加文字

3 个答案: