css scroll text without wrap

hidden webkit-scrollbar


.tabs-title-box::-webkit-scrollbar,
.tabs-content-box::-webkit-scrollbar {
display: none;
width: 0 !important;
height: 0 !important;
background: transparent;
} .tabs-title-box{
box-sizing: border-box;
overflow-x: auto;
max-width: 100vw;
display: flex;
flex-flow: row;
justify-content: start;
align-items: center;
.tabs-title{
// min-width: 48px;
// min-width: 64px;
height:30px;
font-size:30px;
font-family:PingFangSC-Medium,PingFang SC;
font-weight:500;
color:rgba(255,38,97,1);
line-height:30px;
margin: 16px 32px;
text-align: center;
white-space: nowrap;
}
}

white-space: nowrap;


at-tabs--scroll .at-tabs__header {
overflow-x: scroll;
-webkit-overflow-scrolling: touch;
white-space: nowrap;
}

refs



xgqfrms 2012-2020

www.cnblogs.com 发布文章使用:只允许注册用户才可以访问!


css scroll text without wrap & webkit-scrollbar的更多相关文章

  1. CSS文本(Text)属性-----letter-spacing和text-align

       letter-spacing letter-spacing:normal | <length>  指定字符之间的额外间隙 normal:默认间隔.计算值为0 <length&g ...

  2. 2048总结 JavaScript+jQuery(取元素方便,.css,text方法)

    Html部分(界面):1.开始新游戏:2.返回上一步:3.记分栏: 4.16个小格组成: 其中1,2由链接形式实现. a标签中href属性调用js方法: <a href="javasc ...

  3. css scroll bug

    滚动区域不能设置overflow var doc = $(document), win = $(window), h = $("#head"), b = $("#body ...

  4. css:html() text() val()

    转http://www.jb51.net/article/35867.htm .html()用为读取和修改元素的HTML标签    对应js中的innerHTML .html()是用来读取元素的HTM ...

  5. HTML+css基础 Text文本属性

    Text文本属性: 1.颜色  color color:red 2.文本缩进 text-indent 属性值 数字+px: text-indent:10px: 3.文本修饰 text-decorati ...

  6. [css]input text ie6/7 border兼容问题

    [border:none;]当border为“none”时对IE6/7无效边框依然存在 [border:0;]当border为“0”时,所有浏览器都一致把边框隐藏 [border:0;]把border ...

  7. 第4章 css文字text与字体font-face

    text-overflow 与 word-wrap text-overflow:用来设置是否使用一个省略标记(...)标示对象内文本的溢出. 语法: 但是text-overflow只是用来说明文字溢出 ...

  8. webkit内核浏览器的CSS写法

    -webkit-tap-highlight-color: transparent; Mobile上点击链接高亮的时候设置颜色为透明 -webkit-user-select: none; 设置为无法选择 ...

  9. Webkit内核探究【2】——Webkit CSS实现

    注:[转载请注明文章来源.保持原样] 出处:http://www.cnblogs.com/jyli/archive/2010/01/31/1660364.html 作者:李嘉昱 CSS在Webkit中 ...

随机推荐

  1. Linux sudo权限提升漏洞整改方法

    一.漏洞概述 1月26日,Sudo发布安全通告,修复了一个类Unix操作系统在命令参数中转义反斜杠时存在基于堆的缓冲区溢出漏洞.当sudo通过-s或-i命令行选项在shell模式下运行命令时,它将在命 ...

  2. ELK (elasticsearch+kibana+logstash+elasticsearch-head) 华为云下载地址

    https://mirrors.huaweicloud.com/elasticsearch https://mirrors.huaweicloud.com/kibana https://mirrors ...

  3. Mybatis SQL映射文件详解

    Mybatis SQL映射文件详解 mybatis除了有全局配置文件,还有映射文件,在映射文件中可以编写以下的顶级元素标签: cache – 该命名空间的缓存配置. cache-ref – 引用其它命 ...

  4. git的使用学习笔记--项目版本操作

    一.使用场景 版本回退:上线失败--需要回退到上个版本 二.操作 先编辑  vim text.txt git status git add .       这个命令能看到所有的增加操作 git com ...

  5. MySQL高可用HA——keepalived配置

    0. Keepalived介绍   Keepalived是基于VRRP(Virtual Router Redundancy Protocol,虚拟路由器冗余协议)协议的一款高可用软件.Keepaili ...

  6. The router relies on a tree structure which makes heavy use of common prefixes, it is basically a compact prefix tree (or just Radix tree).

    https://github.com/julienschmidt/httprouter/

  7. Python的交互模式和直接运行.py文件有什么区别

    使用文本编辑器 - 廖雪峰的官方网站 https://www.liaoxuefeng.com/wiki/1016959663602400/1017024645952992 直接输入python进入交互 ...

  8. 列表,元祖,range

    列表是python中的基础数据类型之一,其他语言中也有类似于列表的数据类型,比如js中叫数组,他是以[]括起来,每个元素以逗号隔开,而且他里面可以存放各种数据类型比如: li = ['alex',12 ...

  9. ping、telnet

    ping用来检查网络是否通畅或者网络连接速度的命令 telnet是用来探测指定ip是否开放指定端口 Telnet 一 .关于telnet 对于Telnet的认识,不同的人持有不同的观点,可以把Teln ...

  10. Vue3(三)CND + ES6的import + 工程化的目录结构 = 啥?

    突发奇想 这几天整理了一下vue的几种使用方式,对比之后发现有很多相似之处,那么是不是可以混合使用呢?比如这样: vue的全家桶和UI库,采用传统的方式加载(CND.script). 自己写的js代码 ...