HTML标识的overflow解决用应

应用CSS来装饰翻转条
1.overflow內容外溢时的设定

overflow-x水平方位內容外溢时的设定
overflow-y竖直方位內容外溢时的设定
以上3个特性设定的值为visible(默认设置值)、scroll、hidden、auto。

2.scrollbar⑶d-light-color立体式翻转条亮边的色调
scrollbar-arrow-color左右按钮上3角箭头的色调
scrollbar-base-color翻转条的基础色调
scrollbar-dark-shadow-color立体式翻转条强黑影的色调
scrollbar-face-color立体式翻转条凸出一部分的色调
scrollbar-highlight-color翻转条空白一部分的色调
scrollbar-shadow-color立体式翻转条黑影的色调
以上7个特性设定的值全是色调值,可使用款式表界定的各种各样表述方法。

应用以上的款式界定內容,大家能够特定访问器对话框、多写作本框的翻转条的显示信息与否和色调款式,第1组款式特性用于设置被设置目标是不是显示信息翻转条,第2组款式特性则用于设定翻转条的色调,要留意的本文涉及到的款式特性全是ie才可以适用的,第2组的款式特性仅有ie5.5版本号才可以适用,因此请大伙儿在调节的情况下留意。

大家根据几个案例来说解上述的款式特性:

1.让访问器对话框始终都不出現翻转条
沒有水平翻转条
<body style= "overflow-x:hidden ">
沒有竖直翻转条
<body style= "overflow-y:hidden ">
沒有翻转条
<body style= "overflow-x:hidden;overflow-y:hidden "> 或 <body style= "overflow:hidden ">

2.设置多写作本框的翻转条
沒有水平翻转条

拷贝编码
编码以下:
<textarea style= "overflow-x:hidden "> </textarea>

沒有竖直翻转条

拷贝编码
编码以下:
<textarea style= "overflow-y:hidden "> </textarea>

沒有翻转条

拷贝编码
编码以下:
<textarea style= "overflow-x:hidden;overflow-y:hidden "> </textarea>


拷贝编码
编码以下:
<textarea style= "overflow:hidden "> </textarea>


3.设置对话框翻转条的色调
设定对话框翻转条的色调为鲜红色 <body style= "scrollbar-base-color:red ">
scrollbar-base-color设置的是基础色,1般状况下只必须设定这1个特性便可以做到更改翻转条色调的目地。
再加1点非常的实际效果:

拷贝编码
编码以下:
<body style= "scrollbar-arrow-color:yellow;scrollbar-base-color:lightsalmon ">


4.设置别的元素时,基础上1样,你最好是是在款式表文档中界定好1个类,这样你便可以反复应用了。


拷贝编码
编码以下:

.coolscrollbar
{
scrollbar-arrow-color:yellow;
scrollbar-base-color:lightsalmon;
}

将以上句子添加到款式表文档中或html头顶部的 <style> </style> 之中,随后应用
<textarea class= "coolscrollbar "> </textarea>