V2EX = way to explore V2EX 是一个关于分享和探索的地方
Sign Up Now For Existing Member Sign In
iOS 开发实用技术导航 NSHipster 中文版 http://nshipster.cn/ cocos2d 开源 2D 游戏引擎 http://www.cocos2d-iphone.org/ CocoaPods http://cocoapods.org/ Google Analytics for Mobile 统计解决方案 http://code.google.com/mobile/analytics/ WWDC https://developer.apple.com/wwdc/ Design Guides and Resources https://developer.apple.com/design/ Transcripts of WWDC sessions http://asciiwwdc.com Cocoa with Love http://cocoawithlove.com/ Cocoa Dev Central http://cocoadevcentral.com/ NSHipster http://nshipster.com/ Style Guides Google Objective-C Style Guide NYTimes Objective-C Style Guide Useful Tools and Services Charles Web Debugging Proxy Smore
This topic created in 5642 days ago, the information mentioned may be changed or developed.
今天稀里糊涂地看了一堆文章，还是没明白怎样在 iPhone 4 的 Safari 里控制尺寸。
有人说 iPhone 4 里 1pt=2px，但我试图用 pt 来写 CSS，不成功，尺寸奇怪。
后来稀里糊涂地就正常了，能达到我的需求：在 Mac 上以 640×960px 显示，便于截图；在 iPhone 4 里同样以 640×960px 显示（但此时 CSS 里其实是用一半的数值来写的，很诡异）。
但这样怎么也没法在 iPhone 4 里画出 1px 的 border（按理说在 CSS 里写 0.5px 的话 iPhone 4 里应该就显示为 1px，但它显示为 0）。
稀里糊涂地把这些文件放到 GitHub 了，不知有谁能解决这个问题。
https://github.com/lianghai/v2type
感觉可能我用的整个尺寸表述的方式就错了。
有人说 iPhone 4 里 1pt=2px，但我试图用 pt 来写 CSS，不成功，尺寸奇怪。
后来稀里糊涂地就正常了，能达到我的需求：在 Mac 上以 640×960px 显示，便于截图；在 iPhone 4 里同样以 640×960px 显示（但此时 CSS 里其实是用一半的数值来写的，很诡异）。
但这样怎么也没法在 iPhone 4 里画出 1px 的 border（按理说在 CSS 里写 0.5px 的话 iPhone 4 里应该就显示为 1px，但它显示为 0）。
稀里糊涂地把这些文件放到 GitHub 了，不知有谁能解决这个问题。
https://github.com/lianghai/v2type
感觉可能我用的整个尺寸表述的方式就错了。
 | 1 dimlau Nov 23, 2010 是不是四舍五入的问题？ 没有手持设备的飘过…… |
 | 2 lianghai OP @dimlau 应该是 Safari 对数字直接取整的问题……但在 Retina display 上不应该是 1 CSS px = 2 device px 么……它应该在转换为 device px 再去取整啊……我是真不想用图片来做这种简单的边框…… |
 | 3 Sai Nov 23, 2010 应该是行不通的，Retina Screen下Webkit渲染这些线条会自动把1px按2px渲染 |
 | 5 Livid MOD PRO 如果实在要追求这个效果，可以用 PNG…… |
| 6 Livid MOD PRO Nov 23, 2010 实现方法参考 V2EX 的 retina logo。 |
| 7 lianghai OP |
 | 8 diamondtin Nov 23, 2010 retina display下的iDevice的device-pixel-ratio是2，也就是说1px会显示成2个设备像素宽。所以理论上来说在没有缩放（scale）的情况下，1px的点是4个像素。 这样，在不缩放时1px在iphone4和iphone3上显示的效果一致。 比较讨巧的是如何对于不同设备使用不同密度的图片。此时可以使用media query，-webkit-min-device-pixel-ratio: 2)来link不同的css。 如果想保证1px不被缩放，可以使用viewport的meta固定scale，V2EX就在使用“initial-scale=1.0; maximum-scale=1.0;”。 |
| 9 diamondtin Nov 23, 2010 忘记说了，1pt是1个point。1point是1/72英尺，这个css unit一般用在印刷样式上面。 see: http://www.w3schools.com/css/css_units.asp |
| 10 lianghai OP @diamondtin 其实您说的应该是 1 pt = 1/72 inch 吧，“inch”其实是“英寸”。 另外如果您看一下我的代码就会知道我一直是在用 media query 来为 iPhone 4 指定 CSS 的... 我记得为了尝试一个别的效果而用过 viewport 的这个 scale 属性，不过没有出现 pixel-ratio=1 的效果，或许是我其他地方弄错了，晚上试试。多谢提醒 |
 | 11 ilexswam Nov 23, 2010 |
| 13 lianghai OP |
Select Language