DIV固定大小与超出时自动出现滚动条

发布时间:2020-03-17编辑:脚本学堂
本文介绍下,Div固定大小即宽度的方法,当内容超出时自动出现滚动条,有需要的朋友,参考下吧。

参考代码1,
 

复制代码 代码示例:
<style type="text/css">
#Composition{
BORDER-RIGHT: #fff 2px inset;
PADDING-RIGHT: 5px;
BORDER-TOP: #fff 2px inset;
PADDING-LEFT: 5px;
color: #000000;
BACKGROUND: white;
PADDING-BOTTOM: 5px;
OVERFLOW: auto;
BORDER-LEFT: #fff 2px inset;
PADDING-TOP: 5px;
BORDER-BOTTOM: #fff 2px inset;
}
</style>
<div ID="Composition" name="Composition" style="WIDTH: 100%; HEIGHT: 400px">在线编辑器</div>

可编辑的方法:
 

复制代码 代码示例:
<style type="text/css">
#Composition{
BORDER-RIGHT: #fff 2px inset;
PADDING-RIGHT: 5px;
BORDER-TOP: #fff 2px inset;
PADDING-LEFT: 5px;
color: #000000;
BACKGROUND: white;
PADDING-BOTTOM: 5px;
OVERFLOW: auto;
BORDER-LEFT: #fff 2px inset;
PADDING-TOP: 5px;
BORDER-BOTTOM: #fff 2px inset;
}
</style>
<div ID="Composition" contentEditable="true"  name="Composition" style="WIDTH: 100%; HEIGHT: 400px">在线编辑器</div>

参考代码2,
 

复制代码 代码示例:
<div id="div1" style="width:100px;height:100px;overflow:auto;">
<pre>
asdfasdfasdf
脚本学堂_www.jb200.com
asd
adfs
http://www.jb200.com
df
asdf
asdfasd
</pre>
</div>