<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
    <title>scroll </title>
<style>
.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: 0;
background: rgba(0,0,0,0.1);
}
/*核心代码*/
</style>
</head>

<body>
<div class="inner">
<div class="innerbox">
<p style="height:200px;">111</p>
<p style="height:400px;">222</p>
<p>333</p>
</div>
</div>
</body>
</html>

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

  1. css 修改默认滚动条样式

    来自:https://www.cnblogs.com/juqian/p/6273808.html 侵删 <div class="inner"> <div clas ...

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

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

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

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

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

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

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

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

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

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

  7. CSS3或CSS+JS实现改变滚动条样式(兼容所有浏览器)

    /*定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸*/ ::-webkit-scrollbar { width: 16px; /*滚动条宽度*/ height: 16px; /*滚动条高度*/ } ...

  8. css改变谷歌浏览器的滚动条样式

    详细内容请点击 /*---滚动条默认显示样式--*/ ::-webkit-scrollbar-thumb{        height:50px;    outline-offset:-2px;   ...

  9. eclipse 更改默认主题，重写默认滚动条样式（安装DevStyle主题插件）

    1.点击Help->Eclipse Marktplace 2.弹出窗口输入: DevStyle 3.点击安装,重启eclipse 4.可以设置黑色和浅色主题,个人比较喜欢浅色,重点式滚动条样式变 ...

随机推荐

  1. 30 个免费的 Sketch 必备插件

    简评:中秋三天小长假,要不要学点啥?比如简单的设计?比如用 Sketch 做个项目? Sketch 有许多值得称赞的地方,其丰富的插件就是亮点之一.Sketch 的社区有着大量免费高效的插件.今天这篇 ...

  2. 自适应大邻域搜索代码系列之(1) - 使用ALNS代码框架求解TSP问题

    前言 上次出了邻域搜索的各种概念科普,尤其是LNS和ALNS的具体过程更是描述得一清二楚.不知道你萌都懂了吗?小编相信大家早就get到啦.不过有个别不愿意透露姓名的热心网友表示上次没有代码,遂不过瘾啊 ...

  3. Linux之Ubuntu系统安装搜狗输入法

    如何在Ubuntu系统中安装搜狗输入法? 1.第一步  下载搜狗输入法文件for Linux 2.检查更新 update 如果没有更新的话,需要做这一步 3.语言支持 选择fcitx,然后关闭界面 4 ...

  4. Linux之Ubuntu切换root su -

    当在Ubuntu系统从普通用户切换到root用户时,总是会报错,提示错误信息.这时因为我们还没有给系统中的root用户设置密码,我们给Ubuntu系统中的root用户设置一个密码就可以实现普通用户和管 ...

  5. BERT和ULMFIT embedding比较文本分类结果

    Instructions [THIS REPOSITORY IS UNDER DEVELOPMENT AND MOER DATASETS AND MODELS WILL BE ADDED] [FEEL ...

  6. pytest+jenkins安装+allure导出报告

    环境安装: windows7+64位 pytest:4.0.2 allure的安装:allure的python库pytest-allure-adaptor jenkins的安装:2.138.2 JDK ...

  7. [BZOJ 5155][Tjoi2014]电源插排

    传送门 网上大部分题解都写得是动态开点线段树,然而像\(MiEcoku\)这么懒惰的显然不会去写线段树... \(\color{green}{solution}\) 我们考虑来点骚操作. 线段树维护的 ...

  8. 洛谷 P5238 整数校验器

    题目描述 有些时候需要解决这样一类问题:判断一个数 x 是否合法. x 合法当且仅当其满足如下条件: x 格式合法,一个格式合法的整数要么是 0,要么由一个可加可不加的负号,一个 1 到 9 之间的数 ...

  9. Android Studio 学习笔记1.1 创建自己的第一个安卓项目并且打包APK

      自从上一次安装完安卓开发工具Android Studio后抽时间看视屏尝试编写自己的第一个安卓项目约两周的时间 每天下班后会花上1~2小时的时间去学习 目前的成果如下:次元宅的我.apk 嘛 总而 ...

  10. secureCRT scripts as vbs

    gdb multithread debug. lsusb.py # $language = "VBScript" # $interface = "1.0" Su ...