博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
1px的border
阅读量:6858 次
发布时间:2019-06-26

本文共 733 字,大约阅读时间需要 2 分钟。

css中是这样写的:

div{    border-bottom: 1px solid #dfe5e4;}

但在手机上,像素比不为 1 ,由于 webview 的灰度渲染, border 一般会显示为 2-3px

如何使手机上的 border 也显示为 1px ?

尝试了

div{    background: url(xxx.png) 0 bottom repeat-x;    background-size: auto 10px;} 其中xxx.png为一张 1x20 的图片,仅有最下面的 1x1 为有色,其它部分透明。企图通过 background-size 压缩后显示出一条小于 1px 的线

div{    box-shadow: 0 1px 0 #dfe5e4;}div{    box-shadow: inset 0 1px 0 0 #dfe5e4;}

都不好使

-----------------------------------------------------------------------------------------------------------------

最后的解决办法是:

div:after{    content: '';    display: block;    height: 1px;    background: #dfe5e4;}@media screen and (-webkit-min-device-pixel-ratio: 1.5){    div:after{        -webkit-transform:scaley(0.5);    }}

如有更方便的办法,多谢赐教!

转载地址:http://kljyl.baihongyu.com/

你可能感兴趣的文章
Android object size in Dalvik
查看>>
thinkphp中$_validate属性
查看>>
使用SpringMVC创建支持向下兼容的版本化的API接口
查看>>
PHP超全局变量(7):$_FILES[]
查看>>
python使用多线程与自定义event更新tinter的内容
查看>>
04.JavaIO流问题
查看>>
高性能的架构设计
查看>>
wmts 服务概述
查看>>
junit测试失败
查看>>
算法踩坑2-插入排序
查看>>
记录一下在mac上做一个usb linux安装盘
查看>>
【转】ubuntu 开启ip包转发做网关与nat的设置
查看>>
复制二叉树
查看>>
python 实现 数独 解法 (穷举法)
查看>>
用:after和:before实现文字两边的横线
查看>>
闲谈Tomcat性能优化
查看>>
自己编写的ajax类_javascript
查看>>
MySQL重置ROOT密码
查看>>
Maven搭建SpringMVC+Mybatis项目详解【转】
查看>>
js中获取随机数
查看>>