1、多行文字超出隐藏,自动追加 ...

  移动端兼容更好,pc下只能兼容 Safari、Opera 以及 Chrome 等部分浏览器,挺常用。

  (注:为什么要同时加这几个css不在这里详细叙述,详见)

/* Safari、Opera 以及 Chrome */
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;

2、移动端使滚动条不显示

.classname::-webkit-scrollbar{display:none;}

  当然也可以通过 -webkit-scrollbar 让默认滚动条改头换面,如下:

// 滚动条在 chrome 等现代浏览器下美化
.classname::-webkit-scrollbar {
width: 8px;
} .classname::-webkit-scrollbar-track {} .classname::-webkit-scrollbar-thumb {
-webkit-border-radius: 10px;
border-radius: 10px;
background: rgba(125, 113, 113, 0.5);
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5);
} .classname::-webkit-scrollbar-thumb:window-inactive {
background: rgba(125, 113, 113, 0.4);
}

(待续)

常用且难记的一些css的更多相关文章

  1. web前端开发常用的10个高端CSS UI开源框架

    web前端开发常用的10个高端CSS UI开源框架   随着人们对体验的极致追求,web页面设计也面临着新的挑战,不仅需要更人性化的设计理念,还需要设计出更酷炫的页面.作为web前端开发人员,运用开源 ...

  2. 关于css那些常用却有点记不住的属性

    虽然说css样式都比较简单,但是某些单词每次都用到还是没记住怎么拼写,都要百度一番,干脆就汇总一下自己经常忘记的这些,也好方便查找. 单行文本溢出: { overflow: hidden; text- ...

  3. 三角形变形记之纯css实现的分布导航条效果

    三角形变形记,用纯css实现的分布导航条效果 <style type="text/css"> ul,li { list-style-type:none; font-si ...

  4. [转贴] VIM 常用快捷键 --一直记不住

    vim 常用快捷键  原帖地址: https://www.cnblogs.com/tianyajuanke/archive/2012/04/25/2470002.html 1.vim ~/.vimrc ...

  5. 一些实用而又记不住的css技巧

    user-select 禁止用户选中文本 div { user-select: none; /* Standard syntax */ } 清除手机tap事件后element 时候出现的一个高亮 * ...

  6. linux常用命令随记

    常用指令 ls 显示文件或目录 -l 列出文件详细信息l(list) -a 列出当前目录下所有文件及目录,包括隐藏的a(all) mkdir 创建目录 -p 创建目录,若无父目录,则创建p(paren ...

  7. 一些不常用但又很有用的css小tips

    1.box-sizing:border-box box-sizing有三个属性:content-box(默认值) || border-box || inhreit.第一个自然不用说,比如我们设置一个d ...

  8. 前端常用面试题目及答案-HTML&CSS篇

    1. 行内元素和块级元素有哪些? 行内元素: 123456789101112131415161718192021222324252627 <a>     //标签可定义锚   <ab ...

  9. 记一次css字体反爬

    前段时间在看css反爬的时候,发现很多网站都做了css反爬,比如,设置字体反爬的(58同城租房版块,实习僧招聘https://www.shixiseng.com/等)设置雪碧图反爬的(自如租房http ...

随机推荐

  1. vue 修饰符

    Vue.js 为 v-on 提供了事件修饰符来处理 DOM 事件细节,如:event.preventDefault() 或 event.stopPropagation(). Vue.js通过由点(.) ...

  2. hdu6395 (矩阵快速幂+分块)

    Online Judge Online Exercise Online Teaching Online Contests Exercise Author F.A.Q Hand In Hand Onli ...

  3. Win10系列:C#应用控件进阶8

    LineGeometry LineGeometry控件通过指定直线的起点和终点来定义线.LineGeometry对象无法进行自我绘制,因此同样需要使用 Path元素来辅助呈现.LineGeometry ...

  4. 我的第一个Angular2应用

    1需要具备的基本前端基础:HTML.CSS.JavaScript.为了实现对项目包的管理,推荐使用npm NPM是随同NodeJS一起安装的包管理工具,能解决NodeJS代码部署上的很多问题:官网先下 ...

  5. <转载> UE4的Actor类C++简单尝试

    原文链接:   简书小小酥XX https://www.jianshu.com/p/2bcc80f0e789 一开始我用了一段时间UE4,发现如果用蓝图系统真的不太适合我的风格.因为之前一直都是用Un ...

  6. 2018网站Https升级完全攻略

    这篇文章主要讲下HTTPs升级的全部流程,包括SSL/TLS证书获取,证书安装,网站调试(将站内http资源全部改为https+重定向等),升级成功后向谷歌webmaster和GA的重新提交新的网站. ...

  7. 运行go服务器后台挂起(不看调试信息)

    cd程序目录,shell输入go run+项目,接着键盘组合输入CTRL+Z,后台挂起进程. 要结束服务器,则输入fg,查看被挂起的go服务器进程,接着键盘组合输入CTRL+C,中断服务器进程. 此外 ...

  8. Django_简单的数据库交互案例

    https://www.jianshu.com/p/bd0af02e59ba 一.页面展示 做一个简单的数据库交换的练习案例   页面.png 二.创建mysql 表 (1)创建django (2)创 ...

  9. LeetCode算法历程-02

    编写一个程序判断给定的数是否为丑数. 丑数就是只包含质因数 2, 3, 5 的正整数. 示例 1: 输入: 6 输出: true 解释: 6 = 2 × 3 示例 2: 输入: 8 输出: true ...

  10. jquery实现本地图片上传预览和限流处理

    <html> <head> <meta http-equiv="Content-Type" content="text/html; char ...