单独一块儿页面样式

最新推荐文章于 2024-08-27 14:29:58 发布

公众号【架构师也是人】

最新推荐文章于 2024-08-27 14:29:58 发布

阅读量877

点赞数

分类专栏：关于其他文章标签： scroll css 文档 div class html

关于其他专栏收录该内容

23 篇文章 0 订阅

订阅专栏

当在页面中显示大量信息时，为了不使整个页面太长，常常将这些内容放在一个层中，然后再为这个层加上滚动条。这样即显示了全部的信息，又使得页面更加美观。下面是一个简单的带滚动条的层实现(其中涉及的一些CSS样式最好是能够参考一下CSS手册，可以使得整个层更加漂亮)。

<html> <head> <title>Div Scroll</title> <mce:style type="text/css"></mce:style><style type="text/css" mce_bogus="1"> .scroll { width: 50%; /*宽度*/ height: 200px; /*高度*/ color: ; /*颜色*/ font-family: ; /*字体*/ padding-left: 10px; /*层内左边距*/ padding-right: 10px; /*层内右边距*/ padding-top: 10px; /*层内上边距*/ padding-bottom: 10px; /*层内下边距*/ overflow-x: scroll; /*横向滚动条(scroll:始终出现;auto:必要时出现;具体参考CSS文档)*/ overflow-y: scroll; /*竖向滚动条*/ scrollbar-face-color: #D4D4D4; /*滚动条滑块颜色*/ scrollbar-hightlight-color: #ffffff; /*滚动条3D界面的亮边颜色*/ scrollbar-shadow-color: #919192; /*滚动条3D界面的暗边颜色*/ scrollbar-3dlight-color: #ffffff; /*滚动条亮边框颜色*/ scrollbar-arrow-color: #919192; /*箭头颜色*/ scrollbar-track-color: #ffffff; /*滚动条底色*/ scrollbar-darkshadow-color: #ffffff; /*滚动条暗边框颜色*/ } </style> </head> <body> <div align="center"> <div class="scroll">  </div> </div> </body> </html>

公众号【架构师也是人】

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
单独一块儿页面样式

当在页面中显示大量信息时，为了不使整个页面太长，常常将这些内容放在一个层中，然后再为这个层加上滚动条。这样即显示了全部的信息，又使得页面更加美观。下面是一个简单的带滚动条的层实现(其中涉及的一些CSS样式最好是能够参考一下CSS手册，可以使得整个层更加漂亮)。 Div Scroll <!-- .scroll {
复制链接

扫一扫

专栏目录