1. scss

@mixin rounded($param1,$param2) {
   #{$param1}:$param2;
   -webkit-#{$param1}: $param2;
   -moz-#{$param1}: $param2;
   -ms-#{$param1}: $param2;
   -o-#{$param1}:$param2;
}
 
使用方法:

@include rounded(transition,all 0.3s);
 
2.less
.promise(@css, @args) {
   @{css}: @args;
   -webkit-@{css}: @args;
   -moz-@{css}: @args;
   -ms-@{css}: @args;
   -o-@{css}: @args;
}
 
使用方法:

.promise(box-sizing, border-box);
 
3.css
/*多行文本溢出*/
.font_duo {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
/*单行文本溢出*/
.font_dan {
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
}

scss、less 对浏览器兼容的处理方法, css 的单行溢出、多行溢出的更多相关文章

  1. js 浏览器兼容的一些方法

    使用js是一件令人很抓狂的事情,很多的浏览器兼容,一大推的代码,谁的脑袋能记住那么多的东西,只有平时多积累,所谓熟能生巧嘛..这里列出一些常用的兼容代码,一点点积累哈~~~     一.以跨浏览器的方 ...

  2. IE9 以下版本浏览器兼容HTML5的方法,使用百度静态资源的html5shiv包

    <!--[if lt IE9]> <script src="http://apps.bdimg.com/libs/html5shiv/3.7/html5shiv.min.j ...

  3. CSS文本单行或者多行超出区域省略号(...)显示方法

    单行超出时,主要用到几个CSS属性: 1.text-overflow : clip | ellipsis ; clip : 不显示省略标记(...),而是简单的裁切ellipsis : 当对象内文本溢 ...

  4. 浅谈CSS hack(浏览器兼容)

    今天简单写一点关于浏览器兼容的处理方法,虽然百度上已经有很多,但是我还是要写! 先看一个图 这个图描述了2016年1月至8月网民们所使用的浏览器市场份额(来源:http://tongji.baidu. ...

  5. 关于浏览器兼容问题及hack写法

    浏览器的兼容问题 1.浏览器内核: Mozilla Firefox ( Gecko ) Internet Explorer ( Trident ) Opera ( Presto ) Safari ( ...

  6. 转载于山边小溪的博客--编写跨浏览器兼容的 CSS 代码的金科玉律

    http://www.cnblogs.com/lhb25/archive/2010/06/19/1760786.html   原始网页 作为 Web 设计师,你的网站在各种浏览器中有完全一样的表现是很 ...

  7. 多浏览器兼容用javascript获取url参数的方法比较推荐的一种

    多浏览器兼容用javascript获取url参数的方法比较推荐的一种 <script language = javascript> function request(paras){ var ...

  8. CSS3与页面布局学习总结(八)——浏览器兼容与前端性能优化

    一.浏览器兼容 1.1.概要 世界上没有任何一个浏览器是一样的,同样的代码在不一样的浏览器上运行就存在兼容性问题.不同浏览器其内核亦不尽相同,相同内核的版本不同,相同版本的内核浏览器品牌不一样,各种运 ...

  9. CSS-各种cs样式之浏览器兼容处理方式汇总大全(更新中...)

    页面模板 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 ...

随机推荐

  1. windows下caffe GPU版本配置

    由于项目需要,所以在自己本子上配置了一下windows下GPU版本的caffe; 硬件:  win10    ;      gtx1070独显(计算能力6.1): 安装软件:     cudnn-8. ...

  2. STOMP Over WebSocket

    Show Table of Contents What is STOMP? STOMP is a simple text-orientated messaging protocol. It defin ...

  3. Salt Document学习笔记2

    配置文件需修改的内容及注意点: Edit the master config file: 1. Uncomment and change the user: root value to your ow ...

  4. [bzoj3123][洛谷P3302] [SDOI2013]森林(树上主席树+启发式合并)

    传送门 突然发现好像没有那么难……https://blog.csdn.net/stone41123/article/details/78167288 首先有两个操作,一个查询,一个连接 查询的话,直接 ...

  5. oracle数据文件迁移

    这篇文章是从网络上获取的,然后根据内容一步步操作, 1.目前的疑问:移动日志文件的时候,为何要先进行切换? 2.move操作后,再进行rename操作的原理 --------------------- ...

  6. 改变input标签中placeholder显示的颜色

    ::-webkit-input-placeholder { /* WebKit browsers */ color: #A9A9A9; } :-moz-placeholder { /* Mozilla ...

  7. jquery实现右键菜单

    <!DOCTYPE html> <head> <meta http-equiv="Content-Type" content="text/h ...

  8. 使用navicat premium将数据库从Oracle迁移到SQL Server,或从Oracle迁移到MySQL

    有时候我们有迁移数据库的需求,例如从Oracle迁移到SQL Server,或者从MySQL迁移到Oracle. 很多江湖好汉一时不知如何手工操作,所幸的是Navicat提供了迁移的自动化操作界面. ...

  9. OracleOCP认证 之 Linux基础

    Linux 基础 一.SHELL 1: Shell 简介 shell 是用户和Linux 操作系统之间的接口.Linux 中有多种shell, 其中缺省使用的是bash. Linux 系统的shell ...

  10. Java中加密算法介绍及其实现

    1.Base64编码算法 Base64简介 Base64是网络上最常见的用于传输8Bit字节码的编码方式之一,Base64就是一种基于64个可打印字符来表示二进制数据的方法.可查看RFC2045-RF ...