将网页中放入一个灰色背景的代码编辑器如果代码过长可以用滚轮向下滑
要将一个灰色背景的代码编辑器嵌入到网页中，并且允许使用滚轮向下滑动，可以使用以下HTML和CSS代码：
HTML代码：
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="styles.css">
</head>
<body>
<div class="code-editor">
<!-- 在这里插入你的代码 -->
</div>
</body>
</html>
CSS代码（styles.css）：
.code-editor {
background-color: #f2f2f2;
width: 100%;
height: 400px; /* 设置代码编辑器的高度 */
overflow-y: scroll; /* 添加垂直滚动条 */
white-space: pre-wrap; /* 允许代码中的换行和空格 */
padding: 10px;
font-family: Consolas, monospace; /* 设置代码字体 */
font-size: 14px; /* 设置代码字号 */
}
将以上代码保存为一个HTML文件，并将其与一个名为styles.css的CSS文件放在同一个文件夹中。然后，将你的代码插入到<div class="code-editor">标签中即可。
通过设置.code-editor类的高度和添加overflow-y: scroll;，可以在代码编辑器中创建一个固定高度并带有垂直滚动条的区域
原文地址: http://www.cveoy.top/t/topic/iCbS 著作权归作者所有。请勿转载和采集!