- 浏览: 1229607 次
- 性别:
- 来自: 广州
-
文章分类
- 全部博客 (883)
- Spring (101)
- Swing (1)
- Mysql (21)
- Js (59)
- Jsp (2)
- Hibernate (19)
- Myeclipse (5)
- SqlServer 2000 (2)
- poi (15)
- Java (70)
- SSH (12)
- Html (47)
- Fusion Charts (1)
- C\C++ (2)
- 汇编 (36)
- Jquery (37)
- Struts2 (6)
- Ubuntu (16)
- powerDesinger (4)
- Jboss (3)
- JAX-RS (13)
- JAXB (5)
- JAX-WS (11)
- JMS (4)
- WebSocket (8)
- PHP (16)
- Flash (1)
- maven (3)
- Oracle (8)
- HttpClient (6)
- sqlserver (19)
- svn (5)
- Tomcat (3)
- Jdbc (3)
- EsayUi (11)
- 微信公众平台 (19)
- IIS (2)
- Freemarker (11)
- Comet (1)
- Spring MVC (85)
- JBoss Seam (3)
- 二维码 (9)
- Spring Security (4)
- Ehcache (3)
- Apache Shiro (7)
- jackson (16)
- JPA (8)
- jcaptcha (2)
- RSA (2)
- Ajax (6)
- 跟我学Shiro (0)
- Spring4 (19)
- 跟我学spring3 (0)
- css (32)
- excel (4)
- Filter (3)
- 微信公众帐号开发教程 (0)
- Android (6)
- log4j (6)
- 淘宝接口 (17)
- 支付集成 (3)
- 单点登录 (3)
- Html5 (27)
- 移动平台前端 (3)
- Linux (44)
- FusionCharts (27)
- Json Jackson Xml (5)
- 方培工作室-微信开发 (0)
- Apache与Tomcat与IIS整合 (10)
- Nginx (17)
- webService (2)
- apache (4)
- lucene (3)
- lodop (2)
- Shiro (3)
- zTree (2)
- ireport (12)
- Servlet3.0 (5)
- 前端美工 (19)
- AngularJS (1)
- C#开发微信门户及应用 (0)
- Shell (3)
- bat脚本 (16)
- Bootstrap (26)
- Less (10)
- photoshop (6)
- Redis (6)
- Mongodb (10)
- MyBatis (3)
- 数据结构 (0)
- 读写分离-主从复制 (0)
- JFinal (0)
- 百度地图api (3)
- hadoop-hbase-hive-spark (3)
- WebStorm (2)
- Quartz (5)
- ios (0)
- Mina (8)
- Android Studio (4)
- Ratchet教程 (0)
- 移动端重构系列 (1)
- cubic-bezier贝塞尔曲线CSS3动画工具 (1)
- nginx+tomcat+memcached集群 (0)
- 集群 (0)
- ZooKeeper (3)
- Dubbo (0)
- vpn (0)
- kafka (0)
- JVM垃圾回收机制 (0)
- 微信小程序 (0)
- Lua (0)
- Hystrix (0)
- Vue.js (0)
- mycat (0)
- Openresty (0)
- springBoot (0)
- 新分类 (0)
- guava (0)
- 大数据 (0)
- Sentinel (0)
最新评论
-
JackMacing：
中文怎么解决？
SpringMVC与iReport(JasperReports) 5.6整合开发实例 -
18335864773：
用pageoffice把.可以实现在线的文档操作.直接转pdf ...
转：使用jasperreport动态生成pdf,excel,html -
linhao0907：
推荐一款轻量开源的支付宝组件：https://github.c ...
关于Alipay支付宝接口（Java版） -
songronghu：
太好了，非常有用，谢谢分享~
Java ConcurrentModificationException 异常分析与解决方案 -
wzwahl36：
http://www.atool.org/json2javab ...
Java下利用Jackson进行JSON解析和序列化
属性设置： WIDTH: 148;HEIGHT: 146; 根据使用的位置,可调整宽度和高度.
OVERFLOW: scroll; 显示纵横滚动条.上部的演示均属设置为scroll的界面. 但一般都设置为：auto(需要时才显示)
BACKGROUND-COLOR: transparent;
滚动框内部背景颜色.transparent为透明色.其他可使用颜色代码.
|
<div style="WIDTH: 148; HEIGHT: 146; BACKGROUND-COLOR: transparent; OVERFLOW: scroll; scrollbar-face-color:#70807d; scrollbar-arrow-color:#ffffff; scrollbar-highlight-color:#ffffff; scrollbar-3dlight-color:#70807d; scrollbar-shadow-color:#ffffff; scrollbar-darkshadow-color:#70807d; scrollbar-track-color:#ffffff"> |
<div style="WIDTH: 148; HEIGHT: 146; BACKGROUND-COLOR: transparent; OVERFLOW: scroll; scrollbar-3dlight-color:#FF0033; scrollbar-arrow-color:#FFFFFF; scrollbar-track-color:#FFFF33; scrollbar-darkshadow-color:#FFFF33; scrollbar-face-color:#FF0033; scrollbar-highlight-color:#FFFFFF; scrollbar-shadow-color:#FF0033"> |
<div style="WIDTH: 148; HEIGHT: 146; BACKGROUND-COLOR: transparent; OVERFLOW: scroll; scrollbar-3dlight-color:#FF0033; scrollbar-arrow-color:#FFFFFF; scrollbar-track-color:#FFFF33; scrollbar-darkshadow-color:#FFFF33; scrollbar-face-color:#FF0033; scrollbar-highlight-color:#FFFFFF; scrollbar-shadow-color:#FF0033"> |
<div style="WIDTH: 148; HEIGHT: 146; BACKGROUND-COLOR: transparent; OVERFLOW: scroll; SCROLLBAR-FACE-COLOR: EAECEC; SCROLLBAR-HIGHLIGHT-COLOR: EAECEC; SCROLLBAR-SHADOW-COLOR: BLACK; SCROLLBAR-3DLIGHT-COLOR: EAECEC; SCROLLBAR-ARROW-COLOR: EAECEC; SCROLLBAR-TRACK-COLOR: FFFFFF; SCROLLBAR-DARKSHADOW-COLOR: EAECEC"> |
|
<div style="WIDTH: 148; HEIGHT: 146; BACKGROUND-COLOR: transparent; OVERFLOW: scroll; scrollbar-3dlight-color:#595959; scrollbar-arrow-color:#FFFFFF; scrollbar-base-color:#CFCFCF; scrollbar-darkshadow-color:#FFFFFF; scrollbar-face-color:#CFCFCF; scrollbar-highlight-color:#FFFFFF; scrollbar-shadow-color:#595959"> |
<div style="WIDTH: 148; HEIGHT: 146; BACKGROUND-COLOR: transparent; OVERFLOW: scroll; scrollbar-face-color: #FFFFFF; scrollbar-shadow-color: #D2E5F4; scrollbar-highlight-color: #D2E5F4; scrollbar-3dlight-color: #FFFFFF; scrollbar-darkshadow-color: #FFFFFF; scrollbar-track-color: #FFFFFF; scrollbar-arrow-color: #D2E5F4"> |
<div style="WIDTH: 148; HEIGHT: 146; BACKGROUND-COLOR: transparent; OVERFLOW: scroll; scrollbar-shadow-color: #ffffff; scrollbar-highlight-color: #ffffff; scrollbar-face-color: #d9d9d9; scrollbar-3dlight-color: #d9d9d9; scrollbar-darkshadow-color: #d9d9d9; scrollbar-track-color: #ffffff; scrollbar-arrow-color: #ffffff"> |
<div style="WIDTH: 148; HEIGHT: 146; BACKGROUND-COLOR: transparent; OVERFLOW: scroll; scrollbar-shadow-color: #FFFFFF; scrollbar-highlight-color: #FFFFFF; scrollbar-arrow-color: #FFFFFF; scrollbar-face-color: #59ADBB; scrollbar-track-color: #FFFFFF; scrollbar-3dlight-color: #59ADBB; scrollbar-darkshadow-color: #59ADBB"> |
|
<div style="WIDTH: 148; HEIGHT: 146; BACKGROUND-COLOR: transparent; OVERFLOW: scroll; scrollbar-face-color: #FFFFFF; scrollbar-shadow-color: #FFC300; scrollbar-highlight-color: #FFFFFF; scrollbar-3dlight-color: #FFC300; scrollbar-darkshadow-color: #FFFFFF; scrollbar-track-color: #FFFFFF; scrollbar-arrow-color: #FFC300"> |
<div style="WIDTH: 148; HEIGHT: 146; BACKGROUND-COLOR: transparent; OVERFLOW: scroll; scrollbar-3dlight-color:5A5227; scrollbar-arrow-color:FFF8C5; scrollbar-base-color:DDD38D; scrollbar-darkshadow-color:FFF8C5; scrollbar-face-color:DDD38D; scrollbar-highlight-color:FFF8C5; scrollbar-shadow-color:5A5227"> |
<div style="WIDTH: 148; HEIGHT: 146; BACKGROUND-COLOR: transparent; OVERFLOW: scroll; scrollbar-face-color: #9EBFE8; scrollbar-shadow-color: #FFFFFF; scrollbar-highlight-color: #FFFFFF; scrollbar-3dlight-color: #9EBFE8; scrollbar-darkshadow-color: #9EBFE8; scrollbar-track-color: #FFFFFF; scrollbar-arrow-color: #FFFFFF"> |
<div style="WIDTH: 148; HEIGHT: 146; BACKGROUND-COLOR: transparent; OVERFLOW: scroll; scrollbar-face-color: #DB52BC; scrollbar-shadow-color: #E994D6; scrollbar-highlight-color: #E994D6; scrollbar-3dlight-color: #DB52BC; scrollbar-darkshadow-color: #DB52BC; scrollbar-track-color: #E994D6; scrollbar-arrow-color: #FFFFFF"> |
|
<div style="WIDTH: 148; HEIGHT: 146; BACKGROUND-COLOR: transparent; OVERFLOW: scroll; scrollbar-face-color: #333333; scrollbar-shadow-color: #333333; scrollbar-highlight-color: #666666; scrollbar-3dlight-color: #101010; scrollbar-darkshadow-color: #070707; scrollbar-track-color: #101010; scrollbar-arrow-color: #000000"> |
<div style="WIDTH: 148; HEIGHT: 146; BACKGROUND-COLOR: transparent; OVERFLOW: scroll; scrollbar-face-color: #333333; scrollbar-shadow-color: #808080; scrollbar-highlight-color: #333333; scrollbar-3dlight-color: #808080; scrollbar-darkshadow-color: #333333; scrollbar-track-color: #191919; scrollbar-arrow-color: #CCCCCC"> |
<div style="WIDTH: 148; HEIGHT: 146; BACKGROUND-COLOR: transparent; OVERFLOW: scroll; scrollbar-face-color:#FFC4E1; scrollbar-highlight-color:#FFFFFF; scrollbar-3dlight-color:#FF95CA; scrollbar-darkshadow-color:#FFB5DA; scrollbar-shadow-color:#FF6AB5; scrollbar-arrow-color:#FFFFFF; scrollbar-track-color:#FFDDEE"> |
<div style="WIDTH: 148; HEIGHT: 146; BACKGROUND-COLOR: transparent; OVERFLOW: scroll; scrollbar-face-color: #DBEBFE; scrollbar-shadow-color: #B8D6FA; scrollbar-highlight-color: #FFFFFF; scrollbar-3dlight-color: #DBEBFE; scrollbar-darkshadow-color:#458CE4; scrollbar-track-color: #FFFFFF; scrollbar-arrow-color: #458CE4"> |
|
<div style="WIDTH: 148; HEIGHT: 146; BACKGROUND-COLOR: transparent; OVERFLOW: scroll; scrollbar-face-color: #FFFFFF; scrollbar-shadow-color: #885C10; scrollbar-highlight-color: #F8ECD8; scrollbar-3dlight-color: #885C10; scrollbar-darkshadow-color: #F8ECD8; scrollbar-track-color: #F8ECD8; scrollbar-arrow-color: #885C10"> |
<div style="WIDTH: 148; HEIGHT: 146; BACKGROUND-COLOR: transparent; OVERFLOW: scroll; scrollbar-face-color: #222222; scrollbar-highlight-color: #FFFFFF; scrollbar-3dlight-color: #222222; scrollbar-shadow-color: #FFFFFF; scrollbar-darkshadow-color: #222222; scrollbar-track-color: #222222; scrollbar-arrow-color: #222222"> |
<div style="WIDTH: 148; HEIGHT: 146; BACKGROUND-COLOR: transparent; OVERFLOW: scroll; scrollbar-face-color: #FDDEE8; scrollbar-shadow-color: #FDDEE8; scrollbar-highlight-color: #ffffff; scrollbar-3dlight-color: #FDCFDD; scrollbar-darkshadow-color: #FDCFDD; scrollbar-track-color: FFF6F9; scrollbar-arrow-color: #FEA6C0"> |
<div style="WIDTH: 148; HEIGHT: 146; BACKGROUND-COLOR: transparent; OVERFLOW: scroll; scrollbar-3dlight-color:#CCFF00; scrollbar-arrow-color:#FFFFFF; scrollbar-track-color:#FFFFFF; scrollbar-darkshadow-color:#CCFF00; scrollbar-face-color:#CCFF00; scrollbar-highlight-color:#FFFFFF; scrollbar-shadow-color:#FFFFFF"> |
|
这是测试文字
这是测试文字这是测试文字这是测试文字这是测试文字这是测试文字这是测试文字这是测试文字这是测试文字 |
||||
|
①DIV：未设置宽度、高度、溢出；溢出默认为可见，宽度和高度自动调整
|
||||
|
这是测试文字
这是测试文字这是测试文字这是测试文字这是测试文字这是测试文字这是测试文字这是测试文字这是测试文字 |
这是测试文字
这是测试文字这是测试文字这是测试文字这是测试文字这是测试文字这是测试文字这是测试文字这是测试文字 |
这是测试文字
这是测试文字这是测试文字这是测试文字这是测试文字这是测试文字这是测试文字这是测试文字这是测试文字 |
||
|
②DIV：设置宽度、高度，未设置溢出；溢出默认为可见，高度设置无效并自动调整
|
③DIV：设置宽度、高度，溢出为滚动；始终显示滚动条
|
④DIV：设置宽度、高度，溢出为自动；根据内容多少决定是否显示滚动条
|
||
|
这是测试文字
这是测试文字这是测试文字这是测试文字这是测试文字这是测试文字这是测试文字这是测试文字这是测试文字 |
|
|
||
|
⑤DIV：设置宽度、高度，溢出为自动，假透明滚动条样式1；根据内容多少决定是否显示滚动条，利用颜色实现假透明效果1，适用于文字
|
⑥Table/DIV：设置宽度、高度，溢出为自动，背景图片、假透明滚动条样式1；根据内容多少决定是否显示滚动条，利用颜色实现假透明效果1，不适用于背景图片
|
⑦Table/DIV：设置宽度、高度，溢出为自动，背景图片、真透明滚动条样式1；根据内容多少决定是否显示滚动条，利用滤镜实现真透明效果1，适用于文字和背景图片
|
||
|
这是测试文字
这是测试文字这是测试文字这是测试文字这是测试文字这是测试文字这是测试文字这是测试文字这是测试文字 |
|
|
||
|
⑧DIV：设置宽度、高度，溢出为自动，假透明滚动条样式2；根据内容多少决定是否显示滚动条，利用颜色实现假透明效果2，适用于文字
|
⑨Table/DIV：设置宽度、高度，溢出为自动，背景图片、假透明滚动条样式2；根据内容多少决定是否显示滚动条，利用颜色实现假透明效果2，不适用于背景图片
|
⑩Table/DIV：设置宽度、高度，溢出为自动，背景图片、真透明滚动条样式2；根据内容多少决定是否显示滚动条，利用滤镜实现真透明效果2，适用于文字和背景图片
|
||
|
这是测试文字
这是测试文字这是测试文字这是测试文字这是测试文字这是测试文字这是测试文字这是测试文字这是测试文字 |
这是测试文字
这是测试文字这是测试文字这是测试文字这是测试文字这是测试文字这是测试文字这是测试文字这是测试文字 |
|
||
|
⑾DIV：增加“word-break:keep-all;”属性，即可实现横向滚动条。
|
⑿DIV/DIV：嵌入另外一个DIV，并且对他们设置“DIRECTION”属性，即可实现左侧滚动条。
|
发表评论
-
Sublime 插件- px 转rem；Atom 编辑器插件: px2rem-plus
2018-09-07 16:18 0Sublime 插件- px 转rem htt ... -
前端工程师需要明白的「像素」
2018-09-07 09:58 0前端工程师需要明白的「像素」 https://www ... -
淘宝flexible.js漏洞修补
2018-09-06 18:17 0CSS像素、设备独立像素、设备像素之间关系 htt ... -
电脑端预览手机版页面
2018-05-30 23:23 5759QQ:433647 -
flexible.js
2018-05-02 19:01 0http://yunkus.com/mobile-ad ... -
Flex 布局教程
2018-01-09 17:09 0http://www.ruanyifeng.com/ ... -
移动端弹出层加遮罩后禁止滑动
2018-01-08 18:57 0//实现滚动条无法滚动 var mo=functio ... -
易百教程
2017-06-07 14:00 0http://www.yiibai.com/lua/l ... -
已测试-幻灯滑动+滚动列表
2017-01-13 10:25 0<!DOCTYPE html> < ... -
iscroll4升级到iscroll5全攻略笔记 (博主已改行，不再更新）
2017-01-12 15:38 0http://blog.csdn.net/gcz ... -
IScroll5实现下拉刷新上拉加载更
2017-01-12 15:32 0http://blog.csdn.net/chenzh ... -
iscroll5 上下拉动刷新
2017-01-12 15:28 0http://www.cnblogs.com/mrxi ... -
html页面滚动到最底部时，无限滚动
2016-12-19 14:23 0<!DOCTYPE html> & ... -
简约时尚的纯CSS3 Tabs选项卡特效
2016-12-05 11:17 0插件描述：这是一款使用纯CSS3制作的Ta ... -
JS组件系列——表格组件神器：bootstrap table
2016-11-30 11:54 0JS组件系列——表格组件神器：bootstra ... -
Bootstrap可编辑表格
2016-11-30 11:46 0http://blog.csdn.net/lzxad ... -
HTML5中的Range对象的研究
2016-11-24 18:34 0http://www.alixixi.com/web ... -
js createRange与createTextRange的一些用法实例
2016-11-24 13:39 0一、返回createTextRange的text和ht ... -
JS Range HTML文档/文字内容选中、库及应用介绍
2016-11-24 11:49 0http://www.jb51.net/articl ... -
JavaScript中textRange对象使用方法小结
2016-11-24 11:39 0http://www.jb51.net/article ...
相关推荐
下面将详细介绍如何使用CSS来控制HTML中的滚动条样式。 1. **滚动条的基本样式** 默认情况下，滚动条由一个水平的滚动条（用于左右滚动）和一个垂直的滚动条（用于上下滚动）组成，包含一个滑块、轨道以及可能的...
HTML5页面滚动条样式的实现通常涉及到CSS3的伪元素选择器和JavaScript库，如jQuery，来增强浏览器默认滚动条的视觉效果。在本例中，我们关注的是如何使用jQuery和自定义CSS来定制HTML5页面中的滚动条，使得它们更...
在压缩包中的`css.html`文件中，很可能包含了上述知识点的详细解释和实例代码，你可以打开这个文件查看具体的内容，学习如何应用这些CSS属性来定制你自己的滚动条样式。通过自定义滚动条，不仅可以增强网页的美观性...
修改火狐滚动条样式demo,纯css修改火狐默认的滚动条样式
本篇文章将深入探讨如何利用 HTML5 和 CSS3 的特性来实现自定义滚动条样式。 一、CSS3 自定义滚动条样式 在 CSS3 中，可以使用伪元素 `::-webkit-scrollbar`、`::-webkit-scrollbar-thumb`、`::-webkit-scrollbar-...
在网页设计中，滚动条作为一个默认的用户交互元素，其样式通常由浏览器默认定义，但随着网页设计的个性化和用户体验的提升，自定义滚动条样式成为了一种趋势。`jQuery`，作为一款广泛使用的JavaScript库，提供了丰富...
`jQuery`作为一个广泛使用的JavaScript库，提供了丰富的功能，包括自定义滚动条样式，使得开发者能够根据网站的整体设计风格进行个性化设置。本篇文章将详细探讨如何使用jQuery实现滚动条样式的定制。 首先，我们要...
在实际项目中，确保滚动条样式与整体设计保持一致非常重要，这不仅可以提升用户体验，还能增强网页的专业感。通过熟练运用HTML和CSS的这些特性，你可以创造出符合品牌风格且功能完善的滚动条。 总结，HTML和CSS提供...
在这个例子中，`index.html`可能包含了自定义滚动条样式的HTML结构和对相关样式及脚本文件的链接。 `logo.gif`文件可能是网站的logo图像，用于展示品牌形象，通常位于页面的头部。而在`images`目录下，可能包含了...
DIV 滚动条样式详解 在 HTML 中，我们经常需要在 DIV 元素中添加滚动条，以便在内容超出 DIV 区域时，能够滚动查看内容。这篇文章将详细介绍如何使用 CSS 样式表来实现 DIV 滚动条的样式设置。 什么是 DIV 滚动条...
本篇文章将深入探讨“多种风格的浏览器滚动条样式”，并以“malihu-custom-scrollbar-plugin-master”这个压缩包文件中的内容为例，讲解如何自定义滚动条样式，让滚动条成为网站设计的一部分，提升用户体验。...
在本文中，我们将深入探讨如何使用CSS来定制`div`元素的滚动条样式，以提升网页的视觉效果和用户体验。 一、滚动条的基本样式 在默认情况下，浏览器提供了一套统一的滚动条样式。然而，通过CSS3，我们可以自定义...
4. "jquery_custom_scrollbar_vertical.html" 和 "index.html" 是HTML文件，其中包含了应用自定义滚动条样式的代码示例。 5. "mcsDraggerHover.png" 可能是滑块在鼠标悬停时的图像，展示了一个交互状态的变化。 6. ...
本主题将深入探讨“滚动条样式设置”，讲解如何使用JavaScript来实现自定义滚动条样式，并确保其在多浏览器环境下，包括IE，具有良好的兼容性。 一、滚动条的基本样式 默认情况下，滚动条具有操作系统特定的样式，...
在网页设计中，创建动态和交互性的用户体验是至关重要的，这正是伸缩菜单和自定义滚动条样式的目的所在。这两个特性都是通过CSS3和HTML5实现的，它们为网站提供了更高级别的用户界面和视觉吸引力。 首先，让我们...
`malihu-custom-scrollbar-plugin-master` 是一个专门用于自定义滚动条样式的插件，它提供了丰富的定制选项，使得滚动条可以更好地融入到网站的设计风格中。 首先，让我们了解滚动条的基本构成。滚动条通常由两个...
标题“用js自定义滚动条样式（可使用图片哦）”正是指向这样一个技术主题，即如何利用JavaScript和CSS来定制具有个性化外观的滚动条，特别是通过使用图片来增强其视觉效果。 滚动条是网页中非常常见的一种元素，它...
本文将围绕“滚动条样式修改”这一主题，深入探讨如何通过编程技术对滚动条进行定制，提升界面的美观性和一致性。 滚动条在默认情况下，系统会提供统一的样式，但这可能并不符合设计师对于界面视觉效果的要求。特别...
4. **自定义滚动条样式**：浏览器默认的滚动条样式往往较为单一，但通过CSS和Jquery，我们可以定制滚动条的颜色、大小、形状，甚至鼠标滚动的速度和流畅度，使其更符合网页的整体风格。 5. **Jquery插件**：对于更...
在ASP.NET开发中，我们经常会遇到需要自定义滚动条样式以提升用户界面体验的情况。本资源提供了一种方法，通过CSS样式和JavaScript实现ASP.NET页面中的垂直滚动条美化。下面将详细阐述这个主题。 首先，CSS（层叠...