移动端1px问题,为什么会有?如何解决?
因为在移动端,由于屏幕分辨率的不同,现在分为一倍屏、二倍屏、三倍屏。在不同的分辨率上,有可能一像素被渲然成二个像素点或者三个像素点,所以在写代码的时候,我们写的 border: 1px solid #000; 可能实际被渲然为 2px/3px;
在开发中,为什么移动端CSS里面写了1px,实际上看起来比1px粗;了解设备物理像素和逻辑像素的同学应该很容易理解,其实这两个px的含义其实是不一样的,UI设计师要求的1px是指设备的物理像素1px,而CSS里记录的像素是逻辑像素,它们之间存在一个比例关系,通常可以用 javascript 中的 window.devicePixelRatio 来获取,也可以用媒体查询的 -webkit-min-device-pixel-ratio 来获取。当然,比例多少与设备相关。
在手机上border无法达到我们想要的效果。这是因为 devicePixelRatio 特性导致,iPhone的 devicePixelRatio==2,而 border-width: 1px; 描述的是设备独立像素,所以,border被放大到物理像素2px显示,在iPhone上就显得较粗。
解决方法
.border-image-1px {
border-width: 1px 0px;
-webkit-border-image: url("border.png") 2 0 stretch;
border-image: url("border.png") 2 0 stretch;
}
typeof和instanceof相同点与不同点
相同点:
JavaScript 中 typeof 和 instanceof 常用来判断一个变量是否为空, 或者是什么类型的。
不同点:
typeof: 返回值是一个字符串, 用来说明变量的数据类型。
typeof 一般只能返回如下几个结果: number, boolean, string, function, object, undefined。
instanceof: 返回值为布尔值;
instanceof 用于判断一个变量是否属于某个对象的实例。
JS单线程如何改多线程?
class MyThread implements Runnable{
private int ticket=10; //10张车票
public void run(){
for(int i=0;i<=20;i++){
if(this.ticket>0){
System.out.println(Thread.currentThread().getName()+"正在卖票:"+this.ticket--);
}
}
}
}
public class ThreadTicket{
public static void main(String[] args) { //资源共享
MyThread mt=new MyThread();
new Thread(mt, "1号窗口").start();
new Thread(mt, "2号窗口").start();
new Thread(mt, "3号窗口").start();
}
}
网友评论