div内文字超过区域后自动滚动显示
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style>
.scrollable-div {
width: 200px;
height: 100px;
overflow-y: auto;
#border:1px solid #CCC;
#border-radius:5px;
padding:5px;
}
/* 自定义滚动条样式 */
.scrollable-div::-webkit-scrollbar {
width: 3px; /* 滚动条宽度 */
}
.scrollable-div::-webkit-scrollbar-track {
background: #f1f1f1; /* 滚动条轨道颜色 */
}
.scrollable-div::-webkit-scrollbar-thumb {
background: #888; /* 滚动条滑块颜色 */
}
.scrollable-div::-webkit-scrollbar-thumb:hover {
background: #555; /* 鼠标悬浮时滑块颜色 */
}
</style>
</head>
<body>
<div class="scrollable-div">
这里是一些内容，它们可能会超出这个div的容器大小。这里是一些内容，它们可能会超出这个div的容器大小。这里是一些内容，它们可能会超出这个div的。容器大小这里是一些内容，它们可能会超出这个div的容器大小这里是一些内容，它们可能会超出这个div的容器大小这里是一些内容，它们可能会超出这个div的容器大小。
</div>
</body>
</html>