1
cheung 2013-07-27 22:53:48 +08:00
http://isux.tencent.com/responsive-web-design.html
文章下面有说道1px实现方法 |
2
vilic 2013-07-27 22:58:49 +08:00
retina 或者类似的屏幕应该不是, 其他情况下如果无缩放应该是.
|
4
Keinez 2013-07-27 23:25:33 +08:00 via Android
我觉得用em应该好一些,省去px的麻烦,只需要处理图片就行……
没有retina设备所以不关注也没办法关注这些东西…… |
5
dorentus 2013-07-27 23:29:42 +08:00
占了双倍物理像素的 1px 还是 1px 吧
|
7
P233 2013-07-28 00:11:50 +08:00
这个 1px 肯定是相对于显示器分辨率的 1px,retina 接收到的也是 1px,那套算法变成了四倍物理像素,跟 CSS 无关
|
8
Yuguo 2013-07-28 00:11:53 +08:00
retina用户告诉你,是用4个点来渲染普通屏幕上1个点,safari跟chrome都是。
|
10
laogui 2013-07-28 00:44:17 +08:00
@Keinez em也是基于px的。
目前针对retina还得借助于css的Media Queries,和响应式设计一样。做两种大小的图片,用Media让它在高分屏上调用大的那张,下面是个例子: @media all and (-webkit-min-device-pixel-ratio: 1.5) {.logo { background-image: url(../images/[email protected]); background-size: 250px 300px; } } |
11
P233 2013-07-28 00:48:50 +08:00
CSS 中的 1px 肯定不是指物理像素,而是分辨率像素。比如一台 1920*1080 物理像素的显示器,把分辨率调成 1344*756 ,网页中的 1px 是根据分辨率显示的。Retina 需要反向理解,而且 retina 是固定将每个像素点放大4倍,好像没有特别神奇的地方。
|
12
Ricepig OP @P233 好吧,即使是分辨率像素,retina的处理方式也出现了不太一致的地方。这个东西不神奇,反倒觉得有点别扭。所有px都变成了1/2 px,唯独图片不一样。
|
13
P233 2013-07-28 01:13:19 +08:00
其实图片也变了,比如 100*100 的图片,放到 retina 屏幕上看,变成了 200*200 自然不清楚。而把一张 200*200 的图片缩放到 100*100,在普通屏幕上没区别,但到了 retina 上就刚刚好了。
|
14
clowwindy 2013-07-28 12:54:01 +08:00
不是,苹果重新发明了像素。
|