.tab

border-1px{red}

minxin

border-1px(&color)

position:relative
&::after
display:block
position:absolute
left:0
bottom:0

width:100%
border-top:1px solid $color
content:''

媒体查询解决1移动端像素问题

在添加1px的类加同级类.border-1px

@media (-webkit-min-device-pixel-ratio:1.5),(min-device-pixel-ratio:1.5)
.border-1px
&::after
-webkit-transform:scaleY(0.7)
transfom:scaleY(0.7)

@media (-webkit-min-device-pixel-ratio:2),(min-device-pixel-ratio:2)
.border-1px
&::after
-webkit-transform:scaleY(0.5)
transfom:scaleY(0.5)

vue-elem-stylus 的mixin用法的更多相关文章

  1. 详解Vue中watch的高级用法

    我们通过实例代码给大家分享了Vue中watch的高级用法,对此知识点有需要的朋友可以跟着学习下. 假设有如下代码: <div> <p>FullName: {{fullName} ...

  2. vue 中 命名视图的用法

    今天主要记录  vue中命名视图的用法 先奉上官网网址:https://router.vuejs.org/zh/guide/essentials/named-views.html 一般情况下,一个页面 ...

  3. 解决 vue 的缩进问题 及 vue 的 sass 调用 mixin 函数

    1.解决 vue 的缩进问题 配置 eslint , 只要要eslint 对应的值为 0,则 eslint 将不会对其进行检测 (.eslintrc.js  --  rules ) A. 不检测 缩进 ...

  4. vue使用stylus样式预处理器

    vue使用stylus样式预处理器,样式总是报错,需要从上一行的样式回车换行才不会报错 <style lang="stylus" scoped> .navbar mar ...

  5. vue第四单元(初识vue-在页面中直接引入vue框架-学习使用vue语法-vue的指令-介绍data用法-methods用法)

    第四单元(初识vue-在页面中直接引入vue框架-学习使用vue语法-vue的指令-介绍data用法-methods用法) #课程目标 了解 vue 框架的特点 掌握创建 vue 实例 掌握 data ...

  6. vue配置stylus

    首先Vue-init webapck 随便一个name vue项目创建好之后 cnpm i  (利用淘宝镜像) cnpm i stylus stylus-loader -D 进行安装和配置 styl常 ...

  7. Vue.js自定义指令的用法与实例

    市面上大多数关于Vue.js自定义指令的文章都在讲语法,很少讲实际的应用场景和用例,以致于即便明白了怎么写,也不知道怎么用.本文不讲语法,就讲自定义指令的用法. 自定义指令是用来操作DOM的.尽管Vu ...

  8. Vue 自定义一个插件的用法、小案例及在项目中的应用

    1.开发插件 install有两个参数,第一个是Vue构造器,第二个参数是一个可选的选项对象   MyPlugin.install = function (Vue, options) {   // 1 ...

  9. vue和stylus在subline中显示高亮

    首先: 安装这两个插件   Vue Syntax Highlight    和    stylus 1.按住 ctrl + shift + p 2.输入:install Package 3.输入: V ...

  10. vue中watch的详细用法

    在vue中,使用watch来响应数据的变化.watch的用法大致有三种.下面代码是watch的一种简单的用法: <input type="text" v-model=&quo ...

随机推荐

  1. 在命令行上启动genymotion虚拟机

    自从有了genymotion,多机联调就解放了,一台电脑运行两个genymotion虚拟机毫无压力,不过也看用的是哪种os image,之前我以为google自己的Nexus应该最适应,哪知道开起来比 ...

  2. Gulp的学习和使用

    Gulp是一种直观.自动化构建的工具. Gulp是基于Node和NPM,安装教程点这里. 什么是Gulp? Gulp使用了node.js的流控制系统,使其(Gulp)构建更快,因为它不需要将临时文件/ ...

  3. redis学习总结1

    Redis是一个开源的使用ANSI C语言编写.支持网络.可基于内存亦可持久化的日志型.Key-Value数据库,并提供多种语言的API.和普通的Key-Value结构不同,Redis的Key支持灵活 ...

  4. LightOJ 1311 Unlucky Bird (物理题)

    题意:有点长,意思是说有一个鸟,在两列火车之间不停的来回飞,两列相距为d时,都开始减速,直到最后停止下来,正好是相距0米, 现在给定两列车的速度和减速时的加速度,和鸟的速度求 d 和鸟飞过的路程. 析 ...

  5. ps&CPU

    #include <pthread.h> void f();int main() {        f();        return 0;} void f() {        int ...

  6. Protocol Buffers官方文档(开发指南)

    本文是对官方文档的翻译,然后截取了一篇非常优秀的文章片段来帮助理解,本人英文水平有限,基本都是直译,如果有不理解的地方请参考英文官方文档,参考的文章链接在文章末尾 protocol buffers简介 ...

  7. Ansible Playbooks高级使用

    文件操作 文件创建 file 用于设置文件/链接/目录的属性,或者删除文件/链接/目录 ### state如果是directory当目录不存在时会自动创建:如果是file当文件不存在时不会自动创建 - ...

  8. Codeforces Round #558 (Div. 2)B（SET，模拟）

    #include<bits/stdc++.h>using namespace std;int a[100007];int cnt[100007];int main(){    int n; ...

  9. go语言实战教程：实战项目资源导入和项目框架搭建

    从本节内容开始,我们将利用我们所学习的Iris框架的相关知识,进行实战项目开发. 实战项目框架搭建 我们的实战项目是使用Iris框架开发一个关于本地服务平台的后台管理平台.平台中可以管理用户.商品.商 ...

  10. 洛谷P1312 Mayan游戏

    P1312 Mayan游戏 题目描述 Mayan puzzle是最近流行起来的一个游戏.游戏界面是一个 7 行5 列的棋盘,上面堆放着一些方块,方块不能悬空堆放,即方块必须放在最下面一行,或者放在其他 ...