首页 > 其他分享 >直播软件搭建,css设置滚动条样式

直播软件搭建,css设置滚动条样式

时间:2023-05-26 14:25:27浏览次数:40  
标签:样式 滚动条 ul scrollbar webkit 直播 css

直播软件搭建,css设置滚动条样式

设置滚动条样式

/*滚动条样式*/
        ul::-webkit-scrollbar {/*滚动条整体样式*/
             4px;     /*高宽分别对应横竖滚动条的尺寸*/
            height: 4px;
        }
        ul::-webkit-scrollbar-thumb {/*滚动条里面小方块*/
            border-radius: 5px;
            -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
            background: rgba(0,0,0,0.2);
        }
        ul::-webkit-scrollbar-track {/*滚动条里面轨道*/
            -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
            border-radius: 0;
            background: rgba(0,0,0,0.1);
        }
 

​设置滚动条不显示

ul {
list-style: none;
height: 100%;
font-size: 13px;
overflow: auto;
scrollbar-width: none;  /* Firefox */
-ms-overflow-style: none;  /* IE 10+ */
}
ul::-webkit-scrollbar {
display: none;  /* Chrome Safari */
}

 以上就是 直播软件搭建,css设置滚动条样式,更多内容欢迎关注之后的文章

 

标签:样式,滚动条,ul,scrollbar,webkit,直播,css
From: https://www.cnblogs.com/yunbaomengnan/p/17434575.html

相关文章

  • 视频直播源码,JavaScript 下载文件、图片
    视频直播源码,JavaScript下载文件、图片一、下载文件 letdownLoadFile=(obj,name,suffix)=>{   consturl=window.URL.createObjectURL(newBlob([obj]));   constlink=document.createElement('a');   link.style.display='none';   l......
  • 直播系统源代码,js控制滚动条位置
    直播系统源代码,js控制滚动条位置  privaterenderData=()=>{ /*图形渲染方法*/    this.renderCanvas();    /*定位滚动条,要在图形渲染之后定位*/    constdom=document.getElementById(this._para.container)    dom!.style.ove......
  • 海内外直播源码加密技术保障您的隐私安全
     在网络生活中,我们常常会面临一些隐私安全问题,很多坏人会利用自己的技术手段,来对别人的网络隐私进行侵犯,例如:入侵我们的摄像头,入侵我们的网站进行篡改或是窃取信息等。当然直播隐私安全也是如此,有一些不法分子会通过网络抓取,或是将流dump到本地进行播放来侵犯我们的隐私合法权......
  • 如何在Angular应用程序中插入自定义 CSS?这里有答案!
    KendoUIforAngular是专用于Angular开发的专业级Angular组件,telerik致力于提供纯粹的高性能AngularUI组件,无需任何jQuery依赖关系。KendoUIR12023正式版下载Telerik_KendoUI产品技术交流群:726377843    欢迎一起进群讨论为什么需要在Angular应用程序中插入自定义C......
  • GPT虚拟直播Demo系列(一)|GPT接入直播间实现主播与观众互动
    摘要ChatGPT和元宇宙都是当前数字化领域中非常热门的技术和应用。结合两者的优势和特点,可以探索出更多的应用场景和商业模式。例如,在元宇宙中使用ChatGPT进行自然语言交互,可以为用户提供更加智能化、个性化的服务和支持;在ChatGPT中使用元宇宙进行虚拟现实体验,可以为用户提供更加真......
  • CSS(一)
     css简介CSS是层叠样式表(CascadingStyleSheets)的简称.有时我们也会称之为CSS样式表或级联样式表。CSS是也是一种标记语言CSS主要用于设置HTML页面中的文本内容(字体、大小、对齐方式等)、图片的外形(宽高、边框样式、边距等)以及版面的布局和外观显示样式。CS......
  • CSS中自适应屏幕分辨率
    @media与@mediascreen区别@mediascreen的css在打印设备里是无效的,而@media在打印设备里是有效的,如果css需要用在打印设备里,那么就用@media,否则,就用@mediascreen。@media(max-width:1199){//<=1199的设备}@media(max-width:991px){//<=991的设备}@media(max-width:7......
  • CSS设置元素水平居中、垂直居中方式汇总
    按照水平居中、垂直居中、行内元素、块级元素等条件进行组合获取效果水平居中:行内元素解决方案只需要把行内元素包裹在一个属性display为block的父层元素中,并且把父层元素添加如下属性即可:.parent{text-align:center;}水平居中:块状元素解决方案.item{/*这里可以设置......
  • 多客社交圈子小程序的腾讯云实时音视频如何配置配置,适用于语音直播、交友类圈子系统un
    采用的腾讯的实时语音,经过我们对比和测试,腾讯的是最便宜的。新用户免费1万分钟,以后每1000分钟7元。第一步、腾讯云申请实时语音,实时音视频免费试用-购买指南-文档中心-腾讯云新用户免费可领取资源包1万分钟。第二步、添加应用后拿到appid和秘钥。填写在前端的配置文件里,根目录/sit......
  • 音视频技术持续进击,直播互动场景会如何“进化”?
    前言 小到远程会议、直播娱乐,大到元宇宙话题中对于未来互动方式的讨论,音视频技术与我们生活方式的变革息息相关。目前,音视频赛道的技术突破,也给直播互动带来了很多新的玩法和形式。音视频领域有哪些重要的突破?人们对于直播互动有哪些新的需求?音视频技术攻克技术难题有哪些思路......