webkit

　　一.发送效果 　　HTML 　　// 这里是一个svg的占位 　　Send 　　复制代码 　　CSS 　　#send-btn{ 　　display: flex; 　　align-items: center; 　　justify-content: center; 　　height: 100vh; 　　} 　　button { 　　background: #5f55af; 　　border: 0; 　　border-radius: 5px; 　　padding: 10px 30px 10px 20px; 　　color: white; 　　text-transform: uppercase; 　　font-weight: bold; 　　} 　　button svg { 　　display: inline-block; 　　vertical-align: middle; 　　padding-right: 5px; 　　} 　　button:hover svg { 　　animation: fly 2s ease 1; 　　} 　　@keyframes fly { 　　0% { 　　transform: translateX(0%); 　　} 　　50% { 　　transform: translateX(300%); 　　} 　　100% { 　　transform:

↑ 点击上方“ 乔边故事 ”关注我们 ZABBIX自动发现Redis端口并监控 由于一台服务器开启许多Redis实例，如果一台一台的监控太耗费时间，也非常容器出错。这种费力不讨好的事情我们是坚决杜绝的，幸好ZABBIX有自动发现功能，今天我们就来用该功能来监控我们的Redis实例。 监控项 Redis的监控信息主要通过 info 命令来获取，下面列举几个我们的监控项。 uptime_in_days ##redis启动的天数 connected_clients ##redis连接的客户端数 blocked_clients: ##正在等待阻塞命令（BLPOP、BRPOP、BRPOPLPUSH）的客户端的数量 used_memory_peak_human: ##reids所用内存的高峰期 used_memory: ##redis运行起来使用的内存数 expired_keys: ##过期的key数量 evicted_keys: ##删除过期的key数量 keyspace_misses: ##没命中的key数量 keyspace_hits: ##命中的key数量 connected_slaves: ##已连接的从服务器数 rejected_connections: ##因为超过最大连接数被拒接的请求数量 上面只是列举了几个，如果需要更多的监控项可以通过 info 命令获取。如下：

最近开发一款产品，要求PC端两列展示： 移动端展示： 使用display：flex布局，在最外面的wrap上添加overflow-y：auto；手机端使用媒体查询将两列宽度设为100%； 出现问题：当表格数据比较大时，PC端与安卓滚动条出现，滚动无问题，但是苹果IOS在表格里滑动无法触发滚动； 解决方法： 在滚动容器内加 -webkit-overflow-scrolling: touch 添加后偶尔会出现滑动不流畅，仔细查了-webkit-overflow-scrolling该属性 -webkit-overflow-scrolling 属性控制元素在移动设备上是否使用滚动回弹效果. auto : 使用普通滚动, 当手指从触摸屏上移开，滚动会立即停止。 touch : 使用具有回弹效果的滚动, 当手指从触摸屏上移开，内容会继续保持一段时间的滚动效果。继续滚动的速度和持续的时间和滚动手势的强烈程度成正比。同时也会创建一个新的堆栈上下文。 网上查了许多资料，具体有下面的几个坑： 在safari上，使用了-webkit-overflow-scrolling:touch之后，页面偶尔会卡住不动（本次问题） 通过动态添加内容撑开容器，结果根本不能滑动的bug（本次问题） 在safari上，点击其他区域，再在滚动区域滑动，滚动条无法滚动的bug（本次问题） 手势可穿过其他元素触发元素滚动

<div id="showdeposit" class='kz-background-gray kz-padding-bottom-sm'> <header>查看免押金资料</header> <div class="deposit-info"> <p>111</p> <p>111</p> <p>111</p> <p>111</p> <p>111</p> <p>111</p> <p>111</p> <p>111</p> <p>111</p> <p>111</p> <p>111</p> <p>111</p> <p>111</p> <p>111</p> <p>111</p> <p>111</p> <p>111</p> <p>111</p> <p>111</p> <p>111</p> <p>111</p> <p>111</p> <p>111</p> <p>111</p> <p>111</p> <p>111</p> <p>111</p> <p>111</p> <p>111</p> <p>111</p> <p>111</p> <p>111</p> <p>111</p> <p>111</p> <p>111</p> <p>111</p> <p>111</p> <p>111</p> <p>111</p> <p>111</p> </div> </div> header{ position: fixed