.line1 {position:relative}

.line1:after {content:'';position:absolute;bottom:0;left:0;width:100%;height:1px;border-bottom:1px solid #e0e0e0;-webkit-transform:scaleY(.5);transform:scaleY(.5);}

CSS3 移动端 1PX 线变成0.5PX的更多相关文章

  1. 移动端1px线适配问题-------适配各种编译CSS工具 stylus sass styled-componet实现方法

    其实在stylus与sass中实现移动端1像素线各个手机设备的适配问题的原理是一样的, 首先我还是先介绍一下原理和所依赖的方法 原理:其实他们都是通过css3的媒体查询来实现的 步骤思路: 1.给目标 ...

  2. CSS3实现0.5px的边框

    前端页面细节处理好了才会显得精致.边框在网页中是常见的一种样式了.虽然不把它处理为0.5px看上去没毛病,但是想让你做的东西征服更多的人,这些细节处理是必须的. 今天主要说一下如何让边框显示0.5px ...

  3. 移动端页面0.5px border的实现

    移动端上经常发现1px边框异常的粗,因此,决定用伪类配合css3来实现0.5px边框 代码如下: <!doctype html> <html lang="en"& ...

  4. css3写出0.5px的边框

    一说到0.5px的边框,我们一般认为是不行的,因为在ps中0.5px的线也是做不出来的,这个计算机的像素有关系. 废话不多说了,0.5px 其实用的是css3新特性,box-shadow:阴影设置 代 ...

  5. 移动端的0.5px

    最近写移动端页面写的比较多,边边基本上都是用的1px,视觉上也确实有点小粗,这不闲下来啦,具体的研究了下0.5px是怎么实现的,切记,这个效果只有在手机上才能看到效果的 利用了css3的缩放效果 &l ...

  6. CSS3实现0.5px边框

    用CSS设置边框宽度为0.5px,可以使边框看起来更加细腻,特别是在移动端,设计师会有这样的要求. 但遗憾的是,大多数Android手机并不能识别0.5px.因此我们可以使用CSS3来变通的实现0.5 ...

  7. 总结一下各种0.5px的线

    在PC端用1px的边框线,看起来还好,但在手机端看起来就很难看了,而0.5px的分割线会有种精致的感觉.用普通写法border:solid 0.5px red;iPhone可以正常显示,android ...

  8. 移动端安卓手机不能识别border 0.5px解决方案

    由于安卓手机无法识别border 0.5px,因此我们要用0.5px的话必须要借助css3中的-webkit-transform:scale缩放来实现, 原理:将伪元素的宽设为200%,height设 ...

  9. 移动端 Retina屏border实现0.5px

    首先来看一下造成Retina边框变粗的原因 其实这个原因很简单,因为css中的1px并不等于移动设备的1px,这些由于不同的手机有不同的像素密度.在window对象中有一个devicePixelRat ...

随机推荐

  1. Docker Machine搭建并加入节点

    对于集群服务器来讲,要在每台机器上手动安装Docker是一件及其痛苦的事情,还好有Docker Machine这一工具,Docker三剑客中的一角. 一.Docker Machine介绍 这个工具已经 ...

  2. 使用 线性规划 解决 数字 排序问题, +Leapms模型

    问题 将如下一组数字从大到小排序. {10, 20, -32, 177, 0, -11.5, 19, 7, 6.2, -6.28, -2.71, 44} 解决办法 建立数学模型,给出各个数字的次序值. ...

  3. ASCII Art ヾ(≧∇≦*)ゝ

    Conmajia, 2012 Updated on Feb. 18, 2018 What is ASCII art? It's graphic symbols formed by ASCII char ...

  4. 关于C# 中的布尔运算符 "&" "|” 与 其类似的条件布尔运算符 "&&" "||" 区别说明。

    运算符使用说明如下:  分隔符 ———————————————————————————— 分隔符 ———————————————————————————— 上述两个运算符的结果与&和 | 完全 ...

  5. 封装继承多态（OOP）

    封装:把事物封装成类,私有化属性. 继承:共同的特性封装在父类,子类就有父类的属性 父类已经实现了的方法,子类也有需要前面+New 隐藏父类的方法,就不报错了,有这个语法,面试的时候问过,不推荐用. ...

  6. java类的继承（基础）

    ---恢复内容开始--- 这篇随笔和大家讲讲java中类的继承是什么?希望对你们有所帮助. 目录 一.java继承是什么? 二.为什么使用java继承 三.java继承的实现 1.1  java继承的 ...

  7. java基础-String不可变的好处

    一.java内部String类的实现: java 8: public final class String implements java.io.Serializable, Comparable< ...

  8. Yii2设计模式——简单工厂模式

    除了使用 new 操作符之外,还有更多的制造对象的方法.你将了解到实例化这个活动不应该总是公开进行,也会认识到初始化经常造成"耦合"问题. 应用举例 yii\db\mysql\Sc ...

  9. HTTP概念解析

    HTTP--Hyper Text Transfer Protocol HTTP详细介绍(火星的小白 51CTO): https://blog.51cto.com/13570193/2108347 先进 ...

  10. 【NodeJS】基础知识

    nodejs基础 nodejs允许自己封装模块,使得编写程序可以模块化,便于维护整理.在一个js文件中写完封装的函数或对象后,可以使用exports或module.exports来将模块中的函数暴露给 ...