zoukankan      html  css  js  c++  java
  • 自定义滚动条样式

    <!DOCTYPE html>
    <html>
    	<head>
    		<meta charset="UTF-8">
    		<title></title>
    		<style type="text/css">
    			div {
    				 249px;
    				height: 300px;
    				overflow: auto;
    			}			
    			::-webkit-scrollbar {
    				 6px;
    				height: 6px;
    			}
    			/*滚动区域背景*/		
    			::-webkit-scrollbar-track-piece {
    				background-color: silver;
    				-webkit-border-radius: 6px;
    			}	
    			/*竖向滚动条*/		
    			::-webkit-scrollbar-thumb:vertical {
    				height: 5px;
    				background-color: yellow;
    				-webkit-border-radius: 6px;
    			}
    			/*横向滚动条*/			
    			::-webkit-scrollbar-thumb:horizontal {
    				 5px;
    				background-color: red;
    				-webkit-border-radius: 6px;
    			}
    		</style>
    	</head>
    	<body>
    		<div>
    			<p>1111111111111111111111111111111</p>
    			<p>1111111111111111111111111111111</p>
    			<p>1111111111111111111111111111111</p>
    			<p>1111111111111111111111111111111</p>
    			<p>1111111111111111111111111111111</p>
    			<p>1111111111111111111111111111111</p>
    			<p>1111111111111111111111111111111</p>
    			<p>1111111111111111111111111111111</p>
    			<p>1111111111111111111111111111111</p>
    			<p>1111111111111111111111111111111</p>
    			<p>1111111111111111111111111111111</p>
    			<p>1111111111111111111111111111111</p>
    			<p>1111111111111111111111111111111</p>
    			<p>1111111111111111111111111111111</p>
    			<p>1111111111111111111111111111111</p>
    		</div>
    	</body>
    </html>
    

      如果文章对你有帮助,麻烦帮忙点个赞哦!嘿嘿!做一个靠谱的技术博主!

  • 相关阅读:
    codeforces-1194 (div2)
    单链表1(悲剧文本)
    迷宫(深度搜索)
    皇后问题
    关键路径
    [NOI2015]软件包管理器
    [USACO13JAN]岛游记Island Travels
    仓鼠找sugar
    [SHOI2012]魔法树
    [HEOI2016/TJOI2016]树
  • 原文地址:https://www.cnblogs.com/CatcherLJ/p/11174720.html
Copyright © 2011-2022 走看看