如何在博客等文章中添加带有滚动条的文本框

在博客中添加带滚动条的文本框能大大提高文章的可读性。

1. 以csdn博客为例

我们在csdn发布博客的时候会在编辑区看到一个源代码的工具。

注：各类博客产品是不一样的，有的可能是个复选框

2. 我们选中这个工具
3. 选中后文本框变成了一个html的编辑框
4. 我们将以下代码复制进去。如下：

 

<div style="
color: #000000;
background-color: #FFFFFF;
border: solid 2px black;
width: 600px;
height:300px;
overflow: scroll;
scrollbar-face-color: #889B9F;
scrollbar-shadow-color: #3D5054;
scrollbar-highlight-color: #C3D6DA;
scrollbar-3dlight-color: #3D5054;
scrollbar-darkshadow-color: #85989C;
scrollbar-track-color: #95A6AA;
scrollbar-arrow-color: #FFD6DA;
" align="center"><br></div>

5. 我们再次点击第1步提到的工具，回到原始的编辑状态，就可以看到创建好的文本框了。

6. 效果如下图

的撒打算的速度
dsadadasda
dsd




sda

sda


sda

sda

sdaa


sdadsasa
sada
大苏打谁打时代发生发生法双方法是否safsafsafsafasfsafsafasfasfasfasfasfsafsafasfsafsafsafasfasfasfasfsafasfasfasfasfsafasfsafsafasfasfsafasfasfasfsa