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. 一文告诉你Java日期时间API到底有多烂

    前言 你好,我是A哥(YourBatman). 好看的代码,千篇一律!难看的代码,卧槽卧槽~其实没有什么代码是"史上最烂"的,要有也只有"史上更烂". 日期是商 ...

  2. Bitter.Core系列四:Bitter ORM NETCORE ORM 全网最粗暴简单易用高性能的 NETCore ORM 之 示例 查询

    一: 单表模型驱动查询 如下示例代码演示: // 根据ID 查询: var studentquery = db.FindQuery<TStudentInfo>().QueryById(12 ...

  3. Maven 本地仓库

    概述 Maven 的本地资源库是用来存储所有项目的依赖关系(插件 Jar 和其他文件,这些文件被 Maven 下载)到本地文件夹.很简单,当你建立一个 Maven 项目,所有相关文件将被存储在你的 M ...

  4. notepad文件对比

    一/格式转换 我用的是json,就以这个为例吧: 打开软件--插件--插件管理 搜索着两个进行安装,自动重启打开 将文件的代码做好,选择语言--J--可以找到json 用刚安装的插件--json vi ...

  5. detect data races The cost of race detection varies by program, but for a typical program, memory usage may increase by 5-10x and execution time by 2-20x.

    小结: 1. conflicting access 2.性能危害 优化 The cost of race detection varies by program, but for a typical ...

  6. 【网络安全】IOC概念浅析

    OpenIOC(Open Indicator of Compromise,开放威胁指标) MANDIANT 公司发布的情报共享规范,是开源.灵活的框架.OpenIOC是一个记录.定义以及共享威胁情报的 ...

  7. JavaScript代码是怎么执行的?

    前言 众所周知,JavaScript是单线程语言.所以JavaScript是按顺序执行的! 先编译再执行 变量提升 请看下面的例子: console.log(cat) catName("Ch ...

  8. 【Redis 分布式锁】(1)一把简单的“锁”

    原文链接:https://www.changxuan.top/?p=1230 在单体架构向分布式集群架构演进的过程中,项目中必不可少的一个功能组件就是分布式锁.在开发团队有技术积累的情况下,做为团队的 ...

  9. MySQL安装+初始化操作(1)

    先去官网下载自己适合的版本,在这里我选择下载Windows 64位版本的,这是下载地址. 1.下载MySQL,步骤①==>步骤② 2.下载后,解压到除系统盘(C盘)之外的其他盘中 3.解压后在b ...

  10. Linux常用命令,目录解析,思维导图

    文章目录 下载地址 Linux常用命令 linux系统常用快捷键及符号命令 Linux常用Shell命令 Linux系统目录解析 Shell Vi全文本编辑器 Linux安装软件 Linux脚本编制编 ...