css滚动条 透明

html-css022

css滚动条 透明,第1张

这样设置就可以是滚动条变为透明

  ::-webkit-scrollbar {

            height: 0

            width: 0

            color: transparent

        }

这个滚动条是自定义的滚动条,是CSS3自定义滚动条样式 -webkit-scrollbar。

滚动条的css样式主要有三部分组成:

1、::-webkit-scrollbar 定义了滚动条整体的样式;

2、::-webkit-scrollbar-thumb 滑块部分;

3、::-webkit-scrollbar-thumb 轨道部分;

css设置透明度,首先需要知道的是在浏览器中的不同使用,一般在ie中用的是filter:alpha(opacity=0)这个属性来设置div或者是块级元素的透明度,而在firefox中,一般就是直接使用opacity:0,对于兼容的,一般的做法就是在书写css样式的将2个都写上就行,就能实现兼容,具体看代码:

<html>

<head>

#div1{

width:200px

height:600px

margin:0 auto

opacity:0

filter:alpha(opacity=0)//0 代表的是隐藏,就是透明度最低。

}

</head>

<body>

<div id='div1'>

<p>测试文字。</p>

</div>

</body>

</html>