css3单位值与鼠标滚动滑动

CSS3单位：

CSS3中引入了新的单位，使得开发者们能够更加灵活地控制网页元素的大小和位置。以下是一些常见的CSS3单位：

• vw（Viewport Width）：视口宽度的百分之几，1vw等于视口宽度的1%。
• vh（Viewport Height）：视口高度的百分之几，1vh等于视口高度的1%。
• vmin（Viewport Minimum）：视口宽度和高度中较小的一个的百分之几，1vmin等于较小的一个的1%。
• vmax（Viewport Maximum）：视口宽度和高度中较大的一个的百分之几，1vmax等于较大的一个的1%。

这些单位可用于宽度、高度、字体大小等属性的设置。例如：

width: 50vw; /*元素宽度为视口宽度的一半*/
font-size: 3vmin; /*字体大小为视口宽度和高度中较小的一个的3%*/

鼠标滚动滑动事件：

在Web开发中，鼠标滚轮滑动事件是常见的一种交互行为。通过JavaScript监听鼠标滚轮事件，可以实现一些非常有趣的效果。以下是一个简单的例子：

window.addEventListener('wheel',function(event) {
    if (event.deltaY  0) {
        /*向下滚动*/
        console.log('向下滚动');
    }
});

通过判断event.deltaY的值，可以判断滚轮的滑动方向。当deltaY小于0时，鼠标向上滚动；当deltaY大于0时，鼠标向下滚动。开发者们可以利用这个事件实现一些炫酷的效果，比如横向滚动、滚动条样式的美化等等。