css代码怎样改变火狐浏览器中滚动条样式
展开全部
CSS无法控制滚动条的样式。这里推荐几块滚动条美化的插件给你。
1. Windows:全屏窗口滚动插件
该插件可以很好地实现全屏滚动,每滚动一次即为一屏。比如,用户浏览下一屏幕内容时,只需手动滚动到某一位置,该插件会自动滚动显示下一屏全部内容。对于浏览类似于PPT的内容时比较实用。
2. Jquery Scroll Follow:滚动跟随插件
该插件可以使DOM对象随着页面的滚动而移动。你可以设置滚动的速度、偏移等参数。
3. 列表滚动插件
该插件可以为任意列表添加上滚动效果。你可以自定义列表的滚动方向和滚动速度。
4. Sly:灵活的基于ITEM的滚动插件
SLY提供了很多基于项目(如图像/内容画廊)的滚动选项,支持水平和垂直方向的无限滚动。
5. Coverscroll
仿苹果的CoverFlow设计,支持滚动条、鼠标滚轮和手势来滚动查看。
6. Sticky
该插件可以让你的页面中的任何元素在滚动过程中始终可见
7. Tiny Scrollbar:一个轻量级的JQUERY插件
8. Sticky Float:另一个滚动跟随插件
9. Page Scroller:漂亮实用的滚动导航
10. Custom Srollbar:自定义内容滚动条插件
11. Scroll Up:一个轻量级的滚动到顶部插件
1. Windows:全屏窗口滚动插件
该插件可以很好地实现全屏滚动,每滚动一次即为一屏。比如,用户浏览下一屏幕内容时,只需手动滚动到某一位置,该插件会自动滚动显示下一屏全部内容。对于浏览类似于PPT的内容时比较实用。
2. Jquery Scroll Follow:滚动跟随插件
该插件可以使DOM对象随着页面的滚动而移动。你可以设置滚动的速度、偏移等参数。
3. 列表滚动插件
该插件可以为任意列表添加上滚动效果。你可以自定义列表的滚动方向和滚动速度。
4. Sly:灵活的基于ITEM的滚动插件
SLY提供了很多基于项目(如图像/内容画廊)的滚动选项,支持水平和垂直方向的无限滚动。
5. Coverscroll
仿苹果的CoverFlow设计,支持滚动条、鼠标滚轮和手势来滚动查看。
6. Sticky
该插件可以让你的页面中的任何元素在滚动过程中始终可见
7. Tiny Scrollbar:一个轻量级的JQUERY插件
8. Sticky Float:另一个滚动跟随插件
9. Page Scroller:漂亮实用的滚动导航
10. Custom Srollbar:自定义内容滚动条插件
11. Scroll Up:一个轻量级的滚动到顶部插件
展开全部
scrollbar-3d-light-color 设置或检索滚动条亮边框颜色
scrollbar-highlight-color 设置或检索滚动条3D界面的亮边(ThreedHighlight)颜色
scrollbar-face-color 设置或检索滚动条3D表面(ThreedFace)的颜色
scrollbar-arrow-color 设置或检索滚动条方向箭头的颜色
scrollbar-shadow-color 设置或检索滚动条3D界面的暗边(ThreedShadow)颜色
scrollbar-dark-shadow-color 设置或检索滚动条暗边框(ThreedDarkShadow)颜色
scrollbar-base-color 设置或检索滚动条基准颜色。其它界面颜色将据此自动调整
scrollbar-highlight-color 设置或检索滚动条3D界面的亮边(ThreedHighlight)颜色
scrollbar-face-color 设置或检索滚动条3D表面(ThreedFace)的颜色
scrollbar-arrow-color 设置或检索滚动条方向箭头的颜色
scrollbar-shadow-color 设置或检索滚动条3D界面的暗边(ThreedShadow)颜色
scrollbar-dark-shadow-color 设置或检索滚动条暗边框(ThreedDarkShadow)颜色
scrollbar-base-color 设置或检索滚动条基准颜色。其它界面颜色将据此自动调整
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
<style>
.over
{
height: 20px;
overflow: scroll;
overflow-x: hidden;
overflow-y: auto;
}
</style>
<div class="over">
sdfsdfsdf<p>
sdfsdfsdf<p>
sdfsdfsdf<p>
sdfsdfsdf<p>
</div>
.over
{
height: 20px;
overflow: scroll;
overflow-x: hidden;
overflow-y: auto;
}
</style>
<div class="over">
sdfsdfsdf<p>
sdfsdfsdf<p>
sdfsdfsdf<p>
sdfsdfsdf<p>
</div>
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
@-moz-document url-prefix(http://),
url-prefix(https://),
url("chrome://browser/content/bookmarks/bookmarksPanel.xul"),
url("chrome://browser/content/browser.xul"),
url("chrome://browser/content/history/history-panel.xul") {
/* THIS WHOLE CODE SECTION AUTOHIDES ONLY THE VERTICAL SCROLLBARS OF WEBPAGES */
scrollbar *
scrollbar scrollbarbutton { display: none ! important; }
scrollbar scrollbarbutton { visibility: collapse !important }
scrollbar[orient="vertical"]{
background: transparent url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAACCAYAAABsfz2XAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAIGNIUk0AAHolAACAgwAA+f8AAIDpAAB1MAAA6mAAADqYAAAXb5JfxUYAAAAhSURBVHjaYvj//z8DMvb39/+PLoaMmRhIBAAAAAD//wMAB6Qizv4lfkgAAAAASUVORK5CYII=") ! important;
-moz-appearance: none !important;
background-color: transparent !important;
opacity: .75 !important;
min-width: 9px !important;
max-width: 9px !important;
}
/*CAN CHANGE SCROLLBAR WIDTH FROM Default 17px (MUST CHANGE BOTH min-width and max-width to exact same px */
/*Default vertical scrollbar width is 17px */
scrollbar[orient="vertical"]:hover
{
opacity: 1 !important;
-moz-appearance: none !important;
background-color: transparent !important;
min-width: 9px !important;
max-width: 9px !important;
}
/************************************************************************/
/* button you drag down the strip */
scrollbar thumb[orient="vertical"]
{
background: transparent url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAYAAABWdVznAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAIGNIUk0AAHolAACAgwAA+f8AAIDpAAB1MAAA6mAAADqYAAAXb5JfxUYAAAAnSURBVHjaYmQofPWfgQjwv0+UkYGBgYGJgUQwqmGkaAAAAAD//wMA+/4EFULQY9sAAAAASUVORK5CYII=") ! important;
-moz-appearance: none !important;
border-radius: 4px !important;
min-width: 8px !important;
max-width: 8px !important;
border: 1px !important;
}
/* HOVER:button you drag down the strip */
scrollbar thumb[orient="vertical"]:hover
{background: transparent url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAYAAABWdVznAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAIGNIUk0AAHolAACAgwAA+f8AAIDpAAB1MAAA6mAAADqYAAAXb5JfxUYAAAAnSURBVHjaYmQofPWfgQjwv0+UkYGBgYGJgUQwqmGkaAAAAAD//wMA+/4EFULQY9sAAAAASUVORK5CYII=") ! important;
border-radius: 4px !important;
border: 0px !important;
}
/***************************************************************************/
/*////////////////////////////////////////////////////////////////////////////*/
/* THIS WHOLE CODE SECTION AUTOHIDES ONLY THE HORIZONTAL SCROLLBARS OF WEBPAGES */
/*can increase min-height 5px and max-height 5px to have more grab space for horizontal scrollbar (min-height and max-height must be exact same px)*/
scrollbar[orient="horizontal"]{
background: transparent url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAAMCAYAAABIvGxUAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAIGNIUk0AAHolAACAgwAA+f8AAIDpAAB1MAAA6mAAADqYAAAXb5JfxUYAAAAmSURBVHjaYvz//z8DAwMDAxMDFGAyGP39/f8zMDAwMBKhGA8DMAB8qAf8L6w8LwAAAABJRU5ErkJggg==") ! important;
-moz-appearance: none !important;
background-color: transparent !important;
opacity: .75 !important;
min-height: 9px !important;
max-height: 9px !important;
}
/*CAN MAKE HORIZONTAL SCROLLBARS LESS HEIGHT when hovered BELOW:MUST HAVE min-height and max-height exact same px */
/* Default horizontal height is 17px */
scrollbar[orient="horizontal"]:hover
{
opacity: 1 !important;
-moz-appearance: none !important;
background-color: transparent !important;
min-height: 9px !important;
max-height: 9px !important;
}
/*////////////////////// bar /////////////////////////////////////////*/
/* button you drag down the strip */
scrollbar thumb[orient="horizontal"]
{
background: transparent url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAYAAABWdVznAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAIGNIUk0AAHolAACAgwAA+f8AAIDpAAB1MAAA6mAAADqYAAAXb5JfxUYAAAAmSURBVHjaYmQofPWfgQTAxEAiGNUwODQw/v//n7Y2AAAAAP//AwCb0AVuQc6u0wAAAABJRU5ErkJggg==") ! important;
-moz-appearance: none !important;
border-radius: 4px !important;
min-height: 8px !important;
max-height: 8px !important;
border: 1px !important;
margin-left: 0px !important;
}
/* HOVER:button you drag down the strip */
scrollbar thumb[orient="horizontal"]:hover
{background: transparent url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAYAAABWdVznAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAIGNIUk0AAHolAACAgwAA+f8AAIDpAAB1MAAA6mAAADqYAAAXb5JfxUYAAAAmSURBVHjaYmQofPWfgQTAxEAiGNUwODQw/v//n7Y2AAAAAP//AwCb0AVuQc6u0wAAAABJRU5ErkJggg==") ! important;
border-radius: 4px !important;
border: 0px !important;
}
/*///////////////////////////////////////////////////////////////////*/
/* REMOVES THE SCROLLBAR CORNERS THAT CAN BE SEEN ON DARK COLORED WEBPAGES */
scrollcorner{opacity: 0 !important;}
scrollbar scrollcorner:hover {background:transparent !important;}
}
url-prefix(https://),
url("chrome://browser/content/bookmarks/bookmarksPanel.xul"),
url("chrome://browser/content/browser.xul"),
url("chrome://browser/content/history/history-panel.xul") {
/* THIS WHOLE CODE SECTION AUTOHIDES ONLY THE VERTICAL SCROLLBARS OF WEBPAGES */
scrollbar *
scrollbar scrollbarbutton { display: none ! important; }
scrollbar scrollbarbutton { visibility: collapse !important }
scrollbar[orient="vertical"]{
background: transparent url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAACCAYAAABsfz2XAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAIGNIUk0AAHolAACAgwAA+f8AAIDpAAB1MAAA6mAAADqYAAAXb5JfxUYAAAAhSURBVHjaYvj//z8DMvb39/+PLoaMmRhIBAAAAAD//wMAB6Qizv4lfkgAAAAASUVORK5CYII=") ! important;
-moz-appearance: none !important;
background-color: transparent !important;
opacity: .75 !important;
min-width: 9px !important;
max-width: 9px !important;
}
/*CAN CHANGE SCROLLBAR WIDTH FROM Default 17px (MUST CHANGE BOTH min-width and max-width to exact same px */
/*Default vertical scrollbar width is 17px */
scrollbar[orient="vertical"]:hover
{
opacity: 1 !important;
-moz-appearance: none !important;
background-color: transparent !important;
min-width: 9px !important;
max-width: 9px !important;
}
/************************************************************************/
/* button you drag down the strip */
scrollbar thumb[orient="vertical"]
{
background: transparent url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAYAAABWdVznAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAIGNIUk0AAHolAACAgwAA+f8AAIDpAAB1MAAA6mAAADqYAAAXb5JfxUYAAAAnSURBVHjaYmQofPWfgQjwv0+UkYGBgYGJgUQwqmGkaAAAAAD//wMA+/4EFULQY9sAAAAASUVORK5CYII=") ! important;
-moz-appearance: none !important;
border-radius: 4px !important;
min-width: 8px !important;
max-width: 8px !important;
border: 1px !important;
}
/* HOVER:button you drag down the strip */
scrollbar thumb[orient="vertical"]:hover
{background: transparent url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAYAAABWdVznAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAIGNIUk0AAHolAACAgwAA+f8AAIDpAAB1MAAA6mAAADqYAAAXb5JfxUYAAAAnSURBVHjaYmQofPWfgQjwv0+UkYGBgYGJgUQwqmGkaAAAAAD//wMA+/4EFULQY9sAAAAASUVORK5CYII=") ! important;
border-radius: 4px !important;
border: 0px !important;
}
/***************************************************************************/
/*////////////////////////////////////////////////////////////////////////////*/
/* THIS WHOLE CODE SECTION AUTOHIDES ONLY THE HORIZONTAL SCROLLBARS OF WEBPAGES */
/*can increase min-height 5px and max-height 5px to have more grab space for horizontal scrollbar (min-height and max-height must be exact same px)*/
scrollbar[orient="horizontal"]{
background: transparent url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAAMCAYAAABIvGxUAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAIGNIUk0AAHolAACAgwAA+f8AAIDpAAB1MAAA6mAAADqYAAAXb5JfxUYAAAAmSURBVHjaYvz//z8DAwMDAxMDFGAyGP39/f8zMDAwMBKhGA8DMAB8qAf8L6w8LwAAAABJRU5ErkJggg==") ! important;
-moz-appearance: none !important;
background-color: transparent !important;
opacity: .75 !important;
min-height: 9px !important;
max-height: 9px !important;
}
/*CAN MAKE HORIZONTAL SCROLLBARS LESS HEIGHT when hovered BELOW:MUST HAVE min-height and max-height exact same px */
/* Default horizontal height is 17px */
scrollbar[orient="horizontal"]:hover
{
opacity: 1 !important;
-moz-appearance: none !important;
background-color: transparent !important;
min-height: 9px !important;
max-height: 9px !important;
}
/*////////////////////// bar /////////////////////////////////////////*/
/* button you drag down the strip */
scrollbar thumb[orient="horizontal"]
{
background: transparent url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAYAAABWdVznAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAIGNIUk0AAHolAACAgwAA+f8AAIDpAAB1MAAA6mAAADqYAAAXb5JfxUYAAAAmSURBVHjaYmQofPWfgQTAxEAiGNUwODQw/v//n7Y2AAAAAP//AwCb0AVuQc6u0wAAAABJRU5ErkJggg==") ! important;
-moz-appearance: none !important;
border-radius: 4px !important;
min-height: 8px !important;
max-height: 8px !important;
border: 1px !important;
margin-left: 0px !important;
}
/* HOVER:button you drag down the strip */
scrollbar thumb[orient="horizontal"]:hover
{background: transparent url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAYAAABWdVznAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAIGNIUk0AAHolAACAgwAA+f8AAIDpAAB1MAAA6mAAADqYAAAXb5JfxUYAAAAmSURBVHjaYmQofPWfgQTAxEAiGNUwODQw/v//n7Y2AAAAAP//AwCb0AVuQc6u0wAAAABJRU5ErkJggg==") ! important;
border-radius: 4px !important;
border: 0px !important;
}
/*///////////////////////////////////////////////////////////////////*/
/* REMOVES THE SCROLLBAR CORNERS THAT CAN BE SEEN ON DARK COLORED WEBPAGES */
scrollcorner{opacity: 0 !important;}
scrollbar scrollcorner:hover {background:transparent !important;}
}
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询