sass - 公用方法封装
// 设置宽高
@mixin wh($wid,$hei){
@if $wid {
width: $wid;
}
@if $hei {
height: $hei;
}
overflow: hidden;
}
// 设置高度与行高一致
@mixin lineH($index){
height: $index;
line-height: $index;
}
// 父元素相对,子元素绝对
@mixin absolut($index){
position: relative;
&:after{
content: "";
position: absolute;
z-index: $index;
}
}
// 文本样式
@mixin txts($fs,$cl){
@if $fs {
font-size: $fs;
}
@if $cl {
color: $cl;
}
}
// 透明度设置
@mixin op($index){
opacity: $index;
filter: alpha(opacity = ($index * ));
}
// 背景图
@mixin bgImg($link){
background: url("../img/"+$link) no-repeat;
}
// icon图标
@mixin iCon($w,$h,$bg,$index){
@include wh($w,$h)
@include bgImg($bg)
margin-right: $index;
}
// 变形
@mixin transForm($index){
-webkit-transform: $index;
-moz-transform: $index;
-ms-transform: $index;
transform: $index;
}
// 制作小箭头
@mixin arrow($clr,$index){
border-right: 1px solid $clr;
border-bottom: 1px solid $clr;
@include transForm(rotate($index))
}
// 圆角度
@mixin radiu($index){
-webkit-border-radius: $index;
-moz-border-radius: $index;
border-radius: $index;
}
// 盒阴影
@mixin boxSd($shadow...){
-webkit-box-shadow: $shadow;
-moz-box-shadow: $shadow;
-ms-box-shadow: $shadow;
box-shadow: $shadow;
}
// 常用内联块元素设置
%inlineB{
display: inline-block;
_display: inline;
}
sass - 公用方法封装的更多相关文章
- C#常用字符串加解密方法封装
C#中常用的字符串加密.解密方法封装,包含只加密但不解密的方法.收藏起来备用. //方法一 //须添加对System.Web的引用 //using System.Web.Security; /// & ...
- 编写SqlHelper使用,在将ExecuteReader方法封装进而读取数据库中的数据时会产生Additional information: 阅读器关闭时尝试调用 Read 无效问题,解决方法与解释
在自学杨中科老师的视频教学时,拓展编写SqlHelper使用,在将ExecuteReader方法封装进而读取数据库中的数据时 会产生Additional information: 阅读器关闭时尝试调用 ...
- C#方法封装与重构
C#作为一个完全面向对象的语言,有个特性很重要但是往往会不重视,而不重视的结果就会造成代码杂乱难以解读.维护.这个特性就是封装. 这里不是大谈C#的封装,我只讲一个,关于方法封装的一些问题. ...
- DbHelperSQL 判断数据库表结构公用方法
#region 公用方法 /// <summary> /// 判断是否存在某表的某个字段 /// </summary> ...
- util包就是用来放一些公用方法和数据结构的
util包就是用来放一些公用方法和数据结构的
- 基于promise对小程序http请求方法封装
原因是我不想每次请求都复制粘贴那么长的请求地址,所以我把前边那一坨请求地址作为基础地址,只传后台给的路由就ok,而且,并不是每次请求都要显示正在加载,这对小程序体验很差,所以,我加了个形参,用来判断是 ...
- AJAX原理解析与兼容方法封装
AJAX常用参数 AJAX对象兼容 AJAX对象方法与属性 AJAX封装兼容方法源码 AJAX全称Asynchronous JavaScript and XML(异步的JavaScript与XML), ...
- vue项目中使用less或者sass的方法
半年木有更新博客了... 前段时间一直在学习vue,开始记录一下遇到的问题吧 这篇文章主要是总结一下vue中使用less或者sass的方法,以less为例(style.less) 主要是两种 1.对于 ...
- 通用ajax请求方法封装,兼容主流浏览器
ajax简单介绍 没有AJAX会怎么样?普通的ASP.Net每次运行服务端方法的时候都要刷新当前页面. 假设没有AJAX,在youku看视频的过程中假设点击了"顶.踩".评论.评论 ...
随机推荐
- Lemon OA第4篇:常用功能
OA,Office Automation的简写,中文意思办公自动化,不同的人有不同的见解,可以简单的理解为网络化办公,高效.协同是其显著的特点,如今正在朝着智能的方向发展 平时不擅长文字,写出来几句话 ...
- 一步步配置cordova android开发环境
.先安装jdk-8u111-windows-x64(安装jdk1.) .安装android sdk(Android Stand-alone SDK Tools) .配置环境变量 环境变量: JAVA_ ...
- Linux学习笔记(一):文件操作命令
命令 含义 cd / 切换到根目录 cd .. 上级目录 cd ./bin 到同级的bin目录中 cd bin 到同级的bin目录中 cd - usr文件夹 cd ~ 回到root用户的主文件夹 pw ...
- AJAX简单介绍
什么是AJAX Ajax 是 AsynchronousJavaScript and XML(以及 DHTML 等)的缩写. HTML 用于建立 Web表单并确定应用程序其它部分使用的字段. ·J ...
- sqoop定时增量导入导出
sqoop定时增量导入 2013-11-06 14:23 4553人阅读 评论(0) 收藏 举报 sqoop使用hsql来存储job信息,开启metastor service将job信息共享,所有no ...
- jquery datepicker只显示年和月
<html xmlns="http://www.w3.org/1999/xhtml"> <head > <title></titl ...
- 谈谈Android中的Rect类——奇葩的思维
最近在工作中遇到了一些问题,总结下来就是Android中Rect这个类造成的.不得不说,不知道Android SDK的开发人员是怎么想的, 这个类设计的太奇葩了.首先介绍一下Rect类:Rect类主要 ...
- 装饰模式(Decorator Pattern)--------结构型模式
装饰模式可以在不改变一个对象本身功能的基础上给对象增加额外的新行为.装饰模式降低类系统的耦合度,可以动态地增加或删除对象的职责,并使得需要装饰的具体构件类和具体装饰类可以独立变化,以便增加新的具体构件 ...
- ABBYY FineReader操作技巧
使用ABBYY FineReader OCR文字识别软件工作即快速又简单,软件自身常常可以自行处理一切工作,用户只需点击几下软件中的‘主要’按钮.不过,有时要想获得更好的质量结果,或者解决某个不寻常的 ...
- CMD 切换管理员权限
方法一:鼠标右键 这个方法比较比较普通,点开开始找到cmd,右击鼠标“以管理员身份运行(A)”这样调用就是管理员的权限: 方法二:快捷模式 在点开win+R后,选择“以管理员身份运行”,然后确定:可以 ...