H5页面的滚动条在windows浏览器下始终看到(灰色的不可用的)

最新推荐文章于 2024-05-27 16:21:48 发布

weixin_33840661

最新推荐文章于 2024-05-27 16:21:48 发布

阅读量1.9k

点赞数

CC 4.0 BY-SA版权

文章标签：开发工具

原文链接：http://www.cnblogs.com/yk123/p/6605844.html

本文探讨了在Mac和Windows系统中，由于overflow:scroll属性设置不同导致的滚动条显示差异问题。在Mac上滚动条缺失，而Windows上则显示灰色不可用滚动条。解决方案是在body标签中添加style=overflow:auto。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一般这种情况是在某些相关的div上设置了overflow:scroll属性，在mac系统的浏览器下均没有滚动条显示而在windows下的各个浏览器上均可以看到灰色的不可用的滚动条，这种情况我们需要在body标签上加一个style="overflow:auto"即可。

转载于:https://www.cnblogs.com/yk123/p/6605844.html

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

weixin_33840661

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

重温前端基础（一） HTML、CSS、H5C3

←か淡定☆ ヾ的博客

10-10

1934

目录0. WEB 标准构成1. HTML1.1 HTML概念1.2 超文本含义1.3 页面语言1.4 字符集1.5 标签语义化1.6 常用标签1.7 图像标签 img1.8 链接标签1.9 锚点定位 0. WEB 标准构成构成：主要包括结构（Structure）、表现（Presentation）和行为（Behavior）三个方面。标准说明结构结构用于对网页元素进行整理和分类，咱们主要学的是HTML。表现表现用于设置网页元素的版式、颜色、大小等外观样式，主要指的是CSS

HTML5和CSS3 WEB技术开发

张晨光老师的播客

01-02

7205

B站视频参考：https://www.bilibili.com/video/BV1H44y1k7ze/[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-Uwbid43Z-1672665963237)(asseits/image-20210831212039584.png)]HTML:超文本标记语言(Hyper Text Markup Language)，标准通用标记语言下的一个应用。 HTML 不是一种编程语言（C、Java、python、R等），而是一种标记语言 (markup

参与评论您还未登录，请先登录后发表或查看评论

H5之移动端如何让滚动条不隐藏

jexxx的博客

01-12

2487

原来是手机浏览器不支持自定义 scroll，只对 PC 端浏览器生效，推荐使用 iScroll 框架来处理移动端的这种问题。然后在想，是不是其他地方改变了滚动条的显示。找了一圈，也没有啊。

修改滑动条的颜色

前端菜鸟

04-12

956

代码例子直接拿走 /*修改滚动条样式*/ /*修改滚动条样式*/ /*修改滚动条样式*/ ::-webkit-scrollbar { width: 8px; height: 100%; } ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/ border-radius: 5px; -webkit-box-shad...

H5页面滚动时显示滚动条，不滚动时隐藏滚动条

千里之行，始于足下

04-28

2825

【代码】H5页面滚动时显示滚动条，不滚动时隐藏滚动条。

浏览器放大后拖动滚动条 多余的页面背景为灰色怎么解决

Khun_HWJ的博客

12-09

436

直接在css里设置 html{background：#fff}即可

CSS 滚动条样式（圆角样式背景灰色无滚动槽）

m0_49004429的博客

06-04

680

.divAddSearchCustom{ /* overflow:auto; */ overflow-y: scroll; } .divAddSearchCustom::-webkit-scrollbar-thumb { /* 滚动条 样式*/ border-radius: 5px; background-color: #c1c1c1; } ...

手机网站黑灰_HTML手机电脑网站_网页源码移动端前端js效果_H5模板_自适应css源码ui组件.zip

08-04

在这个模板中，JavaScript可能被用来实现交互式功能，如导航菜单的展开与折叠、图片轮播、表单验证、滚动动画等。此外，还可能运用了流行的JavaScript库或框架，如jQuery、Vue.js、React.js等，这些工具能够简化开发...

微信小程序和uni-app面试高频知识点

qq_53694927的博客

11-27

1122

微信小程序和uni-app面试高频知识点

3万字干货HTML+CSS入门指南（建议收藏）

李南江

08-01

4932

什么是浏览器 浏览器是安装在电脑里面的一个软件，能够将网页内容呈现给用户查看，并让用户与网页交互的一种软件。就好比QQ一样都是安装在电脑里面的一个软件，只不过功能不同而已常见主流浏览器 浏览器市场份额-国内统计 浏览器市场份额-国外统计不同的浏览器有不同的浏览器内核， 浏览器内核也就是浏览器所采用的渲染引擎，渲染引擎决定了浏览器如何显示网页的内容，从而导致了浏览器兼容性问题出现 IE内核 Trident 谷歌内核 WebKit / Blink 火狐内核 Gecko Saf

网页、h5默认滚动条样式重构

最新发布

范德萨的博客

05-27

662

此文章用于，让我自己快速设置 浏览器、h5 默认滚动条样式……以上就是今天的内容，三Q！

Vue：overflow-y:scroll下pc端鼠标可以滚轮滚动，移动端手指不能滑动的问题

Lyang666的博客

11-29

3998

移动端滚动布局

解决H5在移动端overflow:scroll滚动条默认不显示和滚动后消失的问题

JulyNight的博客

05-17

7902

今天在工作中，遇到一个关于overflow滚动的问题，我在使用了overflow:scroll进行滚动时，滚动后滚动条自动消失了，需求是需要保留让它一直都在，下面的代码意思是重新设置滚动条的样式 .wf-detailScroll{ overflow-x: scroll; -webkit-overflow-scrolling: touch; } .wf-detailScroll::-webkit-scrollbar-track-piece { backgr

vue滚动条一直显示

qq_30351747的博客

10-09

2044

vue滚动条一直显示使用el-scrollbar 不用鼠标移入才显示滚动条，要一直显示滚动条 .el-scrollbar__bar.is-vertical { opacity: 1; } el-table中也可以这样用 <el-table :max-height="tableHeight" > data（）{ return { tableHeight: window.innerHeight - 200; } } ......

H5自定义滚动条

illlllllllllll的博客

05-30

961

这时需要执行refresh（刷新）方法，在插件内执行destroy方法，将removeEventListener放在this.events.destory中，利用sendEvent执行，这会销毁掉在tap中用户绑定的自定义方法。相比上一个测试版本（详见上一篇博客），我在这个版本支持了滚动动画，并且加入了Tap事件和destroy方法。1、支持用户自定义事件绑定到列表元素上，我采用用户传入dom和自定义的方法，利用tap接口传入插件，在插件中做tap的处理和回调。1、隐藏或显示滚动条，自定义滚动条样式。

移动端H5封装一个 ScrollList 横向滚动列表组件，实现向左滑动

codel

09-16

1238

移动端H5封装一个 ScrollList 横向滚动列表组件，实现向左滑动

用css实现h5基础滚动条

Polarisone的博客

07-19

4440

很多时候我们在页面中需要用到滚动条 浏览器自带的滚动条太丑了,影响美观, 这时候我们就能自己去设置滚动条的样式了 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-w...

强制显示隐藏浏览器滚动条css