常用且难记的一些css
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的更多相关文章
- web前端开发常用的10个高端CSS UI开源框架
web前端开发常用的10个高端CSS UI开源框架 随着人们对体验的极致追求,web页面设计也面临着新的挑战,不仅需要更人性化的设计理念,还需要设计出更酷炫的页面.作为web前端开发人员,运用开源 ...
- 关于css那些常用却有点记不住的属性
虽然说css样式都比较简单,但是某些单词每次都用到还是没记住怎么拼写,都要百度一番,干脆就汇总一下自己经常忘记的这些,也好方便查找. 单行文本溢出: { overflow: hidden; text- ...
- 三角形变形记之纯css实现的分布导航条效果
三角形变形记,用纯css实现的分布导航条效果 <style type="text/css"> ul,li { list-style-type:none; font-si ...
- [转贴] VIM 常用快捷键 --一直记不住
vim 常用快捷键 原帖地址: https://www.cnblogs.com/tianyajuanke/archive/2012/04/25/2470002.html 1.vim ~/.vimrc ...
- 一些实用而又记不住的css技巧
user-select 禁止用户选中文本 div { user-select: none; /* Standard syntax */ } 清除手机tap事件后element 时候出现的一个高亮 * ...
- linux常用命令随记
常用指令 ls 显示文件或目录 -l 列出文件详细信息l(list) -a 列出当前目录下所有文件及目录,包括隐藏的a(all) mkdir 创建目录 -p 创建目录,若无父目录,则创建p(paren ...
- 一些不常用但又很有用的css小tips
1.box-sizing:border-box box-sizing有三个属性:content-box(默认值) || border-box || inhreit.第一个自然不用说,比如我们设置一个d ...
- 前端常用面试题目及答案-HTML&CSS篇
1. 行内元素和块级元素有哪些? 行内元素: 123456789101112131415161718192021222324252627 <a> //标签可定义锚 <ab ...
- 记一次css字体反爬
前段时间在看css反爬的时候,发现很多网站都做了css反爬,比如,设置字体反爬的(58同城租房版块,实习僧招聘https://www.shixiseng.com/等)设置雪碧图反爬的(自如租房http ...
随机推荐
- vue 修饰符
Vue.js 为 v-on 提供了事件修饰符来处理 DOM 事件细节,如:event.preventDefault() 或 event.stopPropagation(). Vue.js通过由点(.) ...
- hdu6395 (矩阵快速幂+分块)
Online Judge Online Exercise Online Teaching Online Contests Exercise Author F.A.Q Hand In Hand Onli ...
- Win10系列:C#应用控件进阶8
LineGeometry LineGeometry控件通过指定直线的起点和终点来定义线.LineGeometry对象无法进行自我绘制,因此同样需要使用 Path元素来辅助呈现.LineGeometry ...
- 我的第一个Angular2应用
1需要具备的基本前端基础:HTML.CSS.JavaScript.为了实现对项目包的管理,推荐使用npm NPM是随同NodeJS一起安装的包管理工具,能解决NodeJS代码部署上的很多问题:官网先下 ...
- <转载> UE4的Actor类C++简单尝试
原文链接: 简书小小酥XX https://www.jianshu.com/p/2bcc80f0e789 一开始我用了一段时间UE4,发现如果用蓝图系统真的不太适合我的风格.因为之前一直都是用Un ...
- 2018网站Https升级完全攻略
这篇文章主要讲下HTTPs升级的全部流程,包括SSL/TLS证书获取,证书安装,网站调试(将站内http资源全部改为https+重定向等),升级成功后向谷歌webmaster和GA的重新提交新的网站. ...
- 运行go服务器后台挂起(不看调试信息)
cd程序目录,shell输入go run+项目,接着键盘组合输入CTRL+Z,后台挂起进程. 要结束服务器,则输入fg,查看被挂起的go服务器进程,接着键盘组合输入CTRL+C,中断服务器进程. 此外 ...
- Django_简单的数据库交互案例
https://www.jianshu.com/p/bd0af02e59ba 一.页面展示 做一个简单的数据库交换的练习案例 页面.png 二.创建mysql 表 (1)创建django (2)创 ...
- LeetCode算法历程-02
编写一个程序判断给定的数是否为丑数. 丑数就是只包含质因数 2, 3, 5 的正整数. 示例 1: 输入: 6 输出: true 解释: 6 = 2 × 3 示例 2: 输入: 8 输出: true ...
- jquery实现本地图片上传预览和限流处理
<html> <head> <meta http-equiv="Content-Type" content="text/html; char ...