如何在博客等文章中添加帶有滾動條的文本框

在博客中添加帶滾動條的文本框能大大提高文章的可讀性。

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