聊天的 CSS 溢出值

Question

我构建了一个聊天应用程序，我认为溢出属性有问题..我希望当用户连接到聊天时向他显示最后一条消息，而他不必向下滚动到最后一条消息。默认情况下，当用户连接到聊天时，它会显示第一条消息，用户必须向下滚动。我的 CSS 是:

.chat{
  height: 175px;
  width: 488px;
  margin: 0 auto;
  background-color: #000;
  padding: 20px 40px;
  border: solid 1px black;
  overflow: auto;
} 

有什么建议吗？

Answer 1

你不能纯粹用 css 来做到这一点，你需要使用 javascript。

var chatDiv = document.getElementsByClassName('chat')[0]; //I assume you only have one chat box!
chatDiv.scrollTop = chatDiv.scrollHeight;