div css 翻转条款式 DIV翻转条特性及款式设定方法

日期:2021-03-11 类型:科技新闻 

关键词:h5互动游戏,微信h5怎么制作,h5转盘抽奖,h5测试制作,凡科H5

DIV翻转条便是运用DIV标识,在里边嵌入CSS款式表,当div所界定的地区的內容做到1定水平时,在div标识里边嵌入CSS款式表,界定overflow的特性值,设定DIV翻转条有关的特性。

这里向大伙儿叙述1下DIV翻转条特性及款式设定,所谓DIV翻转条,便是运用DIV标识,在里边嵌入CSS款式表,添加overflow的特性值,这样,当div所标准的地区内的內容做到1定程序流程时,翻转条就派上用处。

DIV翻转条特性及款式设定

所谓DIV翻转条,便是运用DIV标识,在里边嵌入CSS款式表,添加overflow的特性值,这样,当div所标准的地区内的內容做到1定程序流程时,翻转条就派上用处。其作用大概是以便节省网页页面室内空间,便是所谓的“缩地”了。看看实际效果怎样吧,编码在下1楼出示。

当div所界定的地区的內容做到1定水平时,在div标识里边嵌入css款式表,界定overflow的特性值,设定DIV翻转条有关的特性。
示例编码

拷贝编码
编码以下:

<style type="text/css">
.testDiv{
border-style:solid;
border-width:50px;
border-color:pink;
position:absolute;
top:200px;
left:300px;
height:200px;
width:300px;
overFlow-x:scroll;
overFlow-y:hidden;
scrollBar-face-color:green;
scrollBar-hightLight-color:red;
scrollBar⑶dLight-color:orange;
scrollBar-darkshadow-color:blue;
scrollBar-shadow-color:yellow;
scrollBar-arrow-color:purple;
scrollBar-track-color:black;
scrollBar-base-color:pink;
}
</style>


1.overFlow:
visible却省值,沒有DIV翻转条,依据內容全自动扩撑地区的尺寸,即界定的地区失效
scroll一直显示信息翻转条
hidden沒有翻转条,超过地区的內容不能见
auto依据內容全自动分辨是不是加上翻转条
2.DIV翻转条色调特性
face-color:滑块色调
hightlight-color:高亮度色调
3dlight-color:3维光源色调
darkshadow-color:暗黑色调
shadow-color:黑影色调
arrow-color:箭头色调
track-color:滑道色调
base-color:DIV翻转条的关键色调,在其中包括翻转按钮和翻转滑块
3.overFlow-xoverFlow-y
visible却省值,沒有DIV翻转条,依据內容全自动扩撑地区的尺寸,即界定的地区失效
scroll一直显示信息翻转条
hidden沒有DIV翻转条,超过地区的內容不能见
auto依据內容全自动分辨是不是加上翻转条