[CSS]滚动条样式设置

概述

最近项目中需要，将一个页面嵌入在一个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的差异，你丫是调不出来。

时间： 2024-11-03 21:26:01

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

CSS滚动条样式设置

webkit浏览器css设置滚动条 主要有下面7个属性 ::-webkit-scrollbar 滚动条整体部分,可以设置宽度啥的 ::-webkit-scrollbar-button 滚动条两端的按钮 ::-webkit-scrollbar-track 外层轨道 ::-webkit-scrollbar-track-piece 内层滚动槽 ::-webkit-scrollbar-thumb 滚动的滑块 ::-webkit-scrollbar-corner 边角 ::-webkit-resizer 

css 滚动条样式

1,Overflow内容溢出时的设置 overflow 水平及垂直方向内容溢出时的设置 overflow-x 水平方向内容溢出时的设置 overflow-y 垂直方向内容溢出时的设置 以上三个属性设置的值为visible.scroll.hidden.auto visible 默认值.使用该值时,无论设置的"width"和"height" 的值是多少,其中的内容无论是否超出范围都将被强制显示. hidden 效果与visible相反.任何超出"width&q

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

友言:这两天被滚动条整的无与伦比,在此做下总结: 首先自定义浏览器滚动条的实现原理:计算浏览器滚动条的高度,层级1的高度与滚动条的总高度是一样的,通过相似比例计算: 浏览器滚动条总高度 :滚动条高度 = 层级② :层级① => 关于实现自定义滚轮,首先要对整个布局进行了解: 1. 1.需要显示的层级 和 2.需要被滚动层级 的关系: 层级1 具有 溢出隐藏 属性,目的是为了隐藏 层级2 多出的部分. 由于在 层级1 的包裹之下 层级2 溢出隐藏部分可以通过控制 层级1 的 scrollTop 进

css scrollbar样式设置

一 前言 在CSS 中,如果我们在块级容器上设置了属性: overflow:scroll/* x y 方向都会*/ 或者 overscroll-x:scroll/*只是x方向*/ 或者 overflow-y:scroll /*只是y方向*/ 当块级内容区域超出块级元素范围的时候,就会以滚动条的形式展示,你可以滚动里面的内容,里面的内容不会超出块级区域范围.有时候我们需要自定义滚动条的样式,比如一开始就它显示,比如想改变滚动条的颜色,设置轨道的样式等,那么这篇文章就是为你准备的. 二 正文 1.认

css 字体样式设置

css字体样式(Font Style),属性 时间:2014-05-08 21:49 来源:我爱学习网 | 作者:我爱学习网 | 本文已影响 68353 人 css字体样式(Font Style)是网页中不可或缺的样式属性之一,有了字体样式,我们的网页才能变得更加美观,因此字体样式属性也就成为了每一位设计者必需了解的知识.以下是我精心整理的css字体样式属性知识,供大家学习参考: css文本样式 序号 中文说明 标记语法 1 字体样式 {font:font-style font-variant

CSS链接样式设置

CSS链接样式,我们知道当我们读一篇文章的时候,有的时候鼠标滑到什么一些文字,有的文字下面会有下 划线,或者是颜色发生变化,其实我们都知道这就是一个链接,出现下滑线和颜色发生变化,都是链接的时 候我们对链接样式的设置.以上我们简单的介绍了什么是样式,你可能会问,哇呜,什么是样式,怎样没有定义 其实我们没有定义更好,我们只需要是去理解.可是我还不理解.不急.请听我慢慢道来: 不同的链接可以有不同的样式,链接样式可用CSS任意的属性,比如颜色color,font,background等等.慢着 我们

css 字体样式设置大全

css样式大全(整理版) 字体属性:(font) 大小 {font-size: x-large;}(特大) xx-small;(极小) 一般中文用不到,只要用数值就可以,单位:PX.PD 样式 {font-style: oblique;}(偏斜体) italic;(斜体) normal;(正常) 行高 {line-height: normal;}(正常) 单位:PX.PD.EM 粗细 {font-weight: bold;}(粗体) lighter;(细体) normal;(正常) 变体 {fo

overflow滚动条样式设置，ie和webkit内核

1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 7 <style> 8 body{ 9 /*ie下修改滚动条样式,在webkit内核浏览器无效*/ 10 /*scrollbar-arrow-color: #f4ae21;三角箭头的颜色

listview-fading 滚动条样式设置

fadingEdge-属性用来设置拉滚动条时 ,边框渐变的方向.它有三个属性值可以设置 none:(边框颜色不变) horizontal:(水平方向颜色变淡) vertical:(垂直方向颜色变淡). fadingEdgeLength-用来设置边框渐变的长度. 代码中的使用: ListView lv = (ListView) findViewById(R.id.main_list); // 在代码里设置边框渐变宽度 // lv.setFadingEdgeLength(0); //去掉分割黑线 l