来自:https://www.cnblogs.com/juqian/p/6273808.html 侵删

<div class="inner">
<div class="innerbox">
<p style="height:200px;">这是内容111</p>
<p style="height:400px;">这里是内容222</p>
<p>这里是内容333</p>
</div>
</div>
.inner{
width: 265px;
height: 400px;
position: absolute;
top: 33px;
left: 13px;
/*cursor: pointer;*/
overflow:hidden;
}
.innerbox{
overflow-x: hidden;
overflow-y: auto;
color: #000;
font-size: .7rem;
font-family: "\5FAE\8F6F\96C5\9ED1",Helvetica,"黑体",Arial,Tahoma;
height: 100%;
}
/*滚动条样式*/
.innerbox::-webkit-scrollbar {/*滚动条整体样式*/
width: 4px; /*高宽分别对应横竖滚动条的尺寸*/
height: 4px;
}
.innerbox::-webkit-scrollbar-thumb {/*滚动条里面小方块*/
border-radius: 5px;
-webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
background: rgba(0,0,0,0.2);
}
.innerbox::-webkit-scrollbar-track {/*滚动条里面轨道*/
-webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
border-radius:;
background: rgba(0,0,0,0.1);
}

css 修改默认滚动条样式的更多相关文章

  1. css控制默认滚动条样式

    针对webkit内核的浏览器,使用伪类来改变滚动条的默认样式,详情如下: 滚动条组成部分 1. ::-webkit-scrollbar 滚动条整体部分 2. ::-webkit-scrollbar-t ...

  2. css实现修改默认滚动条样式

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><html><head&g ...

  3. 设置cnblogs默认滚动条样式

    默认滚动条样式丑嘛就不谈了~这里修改为个性化滚动条样式. CSS代码 /*滚动条整体样式*/ body::-webkit-scrollbar { width: 10px; height: 1px; } ...

  4. SharePoint 2010 修改默认列表样式

    SharePoint 2010  修改默认列表样式 :可以通过修改 下面两个全局配置进行修改.(未完..更新中...)  C:\Program Files\Common Files\Microsoft ...

  5. css修改placeholder的样式

    css修改placeholder的样式 input::-webkit-input-placeholder { /* WebKit browsers */ font-size:14px; color: ...

  6. css修改overflow滚动条默认样式

    html代码 <div class="inner"> <div class="innerbox"> <p style=" ...

  7. CSS改变浏览器默认滚动条样式

    前言 最近总是看到某网站滚动条不是浏览器默认样式,而是自定义样式   比如我博客的滚动条,自定义滚动条样式和hover前后的效果 顿时来了兴致和有一个疑问,这是怎么实现的呢? 解决   注:经测试,目 ...

  8. [分享] 通过修改CSS自定义chrome滚动条样式

    首先得说一句 我不懂CSS的写法之类的 这段CSS也是在网上找的 所以有更先进的需求的话 我肯定不能满足你们了 不好意思效果图在10楼有人上了 我这边不管怎么弄 上传图片都卡在96% 而且不翻wall ...

  9. 自设chrome默认滚动条样式

    今天无聊,想着chrome这种全面使用html的浏览器,可不可以让我自行改变它的默认CSS呢,结果去查查,有,很好 win7/8目录为 C:\Users\[你的用户名]\AppData\Local\G ...

随机推荐

  1. Java开发必须掌握的线上问题排查命令

    作为一个合格的开发人员,不仅要能写得一手还代码,还有一项很重要的技能就是排查问题.这里提到的排查问题不仅仅是在coding的过程中debug等,还包括的就是线上问题的排查.由于在生产环境中,一般没办法 ...

  2. 初探机器学习之使用百度EasyDL定制化模型

    一.Why 定制化模型 一般来说,各大云服务厂商只会提供一些最常见通用的AI服务,针对具体场景的AI应用则需要在云服务厂商提供的服务之上进行定制.例如,通常的图像识别只能做到分析照片的主题内容,而我的 ...

  3. 《前端之路》之 前端图片 类型 & 优化 & 预加载 & 懒加载 & 骨架屏

    目录 09: 前端图片 类型 & 优化 & 预加载 & 懒加载 & 骨架屏 09: 前端图片 类型 & 优化 & 预加载 & 懒加载 & ...

  4. c# 创建Excel com加载项图片对象批量操作

    技术含量较低,主要是通过VBA代码转换成c#代码而来,从而实现图片批量插入.删除.另存为的批量操作,增加文档使用的通用性. 插件主要界面如下: 主要代码如下: private void button8 ...

  5. android 自定义权限管理

    在Android6.0后有些权限就需要进行询问,虽然可以将targetSdkVersion设置成小于等于23,但是这样可能有些东西无法使用,所以要进行权限的管理. 实现逻辑:打开页面就询问权限,如果没 ...

  6. Android-----Intent中通过startActivity(Intent intent )显式启动新的Activity

    Intent:即意图,一般是用来启动新的Activity,按照启动方式分为两类:显式Intent 和 隐式Intent 显示Intent就是直接以“类名称”来指定要启动哪一个Activity:Inte ...

  7. Sentry快速开始并集成钉钉群机器人

    Sentry(直译为:哨兵)是一个开源错误跟踪服务,帮助开发人员实时监控和修复崩溃 Sentry本质上是一种帮助您实时监控和修复崩溃的服务 1.  安装客户端SDK 这里我们安装Java平台的SDK, ...

  8. 使用bat脚本永久激活Windows系统

    每次重装完系统后,右下角会提示系统未激活,无法进行一些个性化设置. 在这里我自己写了一个bat脚本用于激活Windows系统.(仅供学习) 文件下载: 链接:https://pan.baidu.com ...

  9. IDEA zookeeper插件的使用

    安装插件 file-settings-Plugins 搜索zookeeper,并安装,安装完成后重启IDEA 配置IP地址和端口 位于Other settings 中的zookeeper选项中配置 注 ...

  10. Feign源码解析

    1. Feign源码解析 1.1. 启动过程 1.1.1. 流程图 1.1.2. 解释说明 Feign解析过程依赖Spring的初始化,它通过实现ImportBeanDefinitionRegistr ...