概述

最近项目中需要,将一个页面嵌入在一个webbrower中,这个webrower是定高的,在页面内容超过webbrower高度时,需要以滚动条的形式展现,当时也考虑了使用webbrower的滚动条,但是无法获取页面的实际高度,就放弃了,而是采用给页面的div加滚动条的方式。

滚动条css

在任何情况下,如果网页超出显示范围,就会出现滚动条。但有时我们并不想让它显示,如何隐藏它呢?只需在<body></body>之间插入代码:

<body style="overflow-x:hidden;overflow-y:hidden">

即可。其中x表示水平滚动条,将其改为y的话就可以隐藏垂直滚动条。

滚动条各条语句含义如下:

Crollbar-Face-color:滚动条页面颜色设定;
Scrollbar-Highlight-Color:滚动条斜面和左面颜色设定;
Scrollbar-Shadow-Color:滚动条下斜面和右面颜色设定;
Scrollbar-3Dlight-Color:滚动条上边和左边的边沿颜色设定;
Scrollbar-Arrow-Color:滚动条两端箭头颜色设定;
Scrollbar-Track-Color:滚动条底版颜色设定;
Scrollbar-Darkshadow-Color:滚动条下边和右边的边沿颜色设定

总结

最近项目中,虽然涉及到样式,但是也是自己一点一点扣出来的,如果让我选择的话,我宁愿去写js也不想弄样式,有时候就为了那1px的差异,你丫是调不出来。

[CSS]滚动条样式设置的更多相关文章

  1. CSS滚动条样式设置

    webkit浏览器css设置滚动条 主要有下面7个属性 ::-webkit-scrollbar 滚动条整体部分,可以设置宽度啥的 ::-webkit-scrollbar-button 滚动条两端的按钮 ...

  2. CSS文本溢出效果&滚动条样式设置

    一.文本溢出 1.overflow: hidden;  超出文本会被剪裁隐藏不可见 scroll;超出文本会被剪裁, 显示滚动条 auto; 如果文本超出会显示滚动条,没超出不会显示, overflo ...

  3. 四大伪类,css鼠标样式设置,reset操作,静止对文本操作

    07.31自我总结 一.a标签的四大伪类 a:link{样式} 未访问时的状态(鼠标点击前显示的状态) a:hover{样式} 鼠标悬停时的状态 a:visited{样式} 已访问过的状态(鼠标点击后 ...

  4. css 滚动条样式

    1,Overflow内容溢出时的设置 overflow 水平及垂直方向内容溢出时的设置 overflow-x 水平方向内容溢出时的设置 overflow-y 垂直方向内容溢出时的设置 以上三个属性设置 ...

  5. HTML+CSS 滚动条样式自定义 - 适用于 div,iframe, html 等

    友言:这两天被滚动条整的无与伦比,在此做下总结: 首先自定义浏览器滚动条的实现原理:计算浏览器滚动条的高度,层级1的高度与滚动条的总高度是一样的,通过相似比例计算: 浏览器滚动条总高度 :滚动条高度 ...

  6. css 字体样式设置大全

    css样式大全(整理版)   字体属性:(font) 大小 {font-size: x-large;}(特大) xx-small;(极小) 一般中文用不到,只要用数值就可以,单位:PX.PD 样式 { ...

  7. css 字体样式设置

    css字体样式(Font Style),属性 时间:2014-05-08 21:49 来源:我爱学习网 | 作者:我爱学习网 | 本文已影响 68353 人   css字体样式(Font Style) ...

  8. overflow滚动条样式设置,ie和webkit内核

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. css滚动条样式修改

    .activeMoreBankList{ height: 188px; overflow-y: auto;} /*滚动条样式*/.activeMoreBankList::-webkit-scrollb ...

随机推荐

  1. SpringMVC——如何获取请求参数

    参考 http://www.cnblogs.com/bigdataZJ/p/springmvc2.html (文章讲了几个注解的使用,但不够深入.) 参考 http://www.cnblogs.com ...

  2. HASHMAP原理解析,不错的文章

    http://blog.csdn.net/vking_wang/article/details/14166593

  3. WebComponents四大天王教程

    Shadow Dom: http://www.html5rocks.com/zh/tutorials/webcomponents/shadowdom/ http://www.html5rocks.co ...

  4. 【BZOJ3670】【NOI2014】动物园 [KMP][倍增]

    动物园 Time Limit: 10 Sec  Memory Limit: 512 MB[Submit][Status][Discuss] Description 近日,园长发现动物园中好吃懒做的动物 ...

  5. [ CodeVS冲杯之路 ] P2492

    不充钱,你怎么AC? 题目:http://codevs.cn/problem/2492/ 在此先orz小胖子,教我怎么路径压缩链表,那么这样就可以在任意节点跳进链表啦(手动@LCF) 对于查询操作,直 ...

  6. KM算法讲解

    对于二分图,我们可以用匈牙利来求出来最大匹配,但是如果给定每条边一个权值,我们要求这张图的最大匹配最大(小)权,单纯的用匈牙利就没法解决了,当然用费用流也可以做,但是代码较长,在处理完全二分图的时候时 ...

  7. [Leetcode Week6]Reorder List

    Reorder List 题解 原创文章,拒绝转载 题目来源:https://leetcode.com/problems/reorder-list/description/ Description G ...

  8. servlet(4) - servletAPI - 小易Java笔记

    Servlet规范核心类图 1.请求和响应对象 ==> HTTP协议包含请求和响应部分. ==> HttpServletRequest就代表着请求部分 ==> HttpServlet ...

  9. Spring Boot 项目部署到本地Tomcat,出现访问路径问题

    首先确定war 包没问题,把war包放在webapps目录下,访问http://localhost:8080/ + 项目名称 发现首页可以访问但css,js请求都是404,跳转页面也是404 解决方法 ...

  10. Python Standard Library

    Python Standard Library "We'd like to pretend that 'Fredrik' is a role, but even hundreds of vo ...