iPhone网站开发点滴

　2010-06-22 19:08:00　来源：WEB开发网　　　

核心提示：这几天接到北京提出的iphone网站开发项目，看到视觉稿，iPhone网站开发点滴，也确实够晕的，仔细想想，虽然可以在ontouchstart和ontouchend事件中通过return false可是实现，但是这取消了链接或者按钮默认的功能，需要使用到很多css3圆角和背景技术，从这点来说

这几天接到北京提出的iphone网站开发项目，看到视觉稿，也确实够晕的。仔细想想，需要使用到很多css3圆角和背景技术，从这点来说，玩玩 css3，也确实不错。

上面列出的部分视觉稿中，按钮的样式、导航的渐变背景，以及带有icon前缀修饰的按钮，渐变背景和圆角都是用了css3的-khtml- border- radius，background:-webkit-gradient(linear, 0 0, 0 100%, from(#fefefe), to(#d8d8d9))。css3，玩起来还是不错的，在这里我不想讨论css3的使用技巧，只是想把在做的过程中遇到的一些问题，亮出来晒晒。

HTML的head标签内需要显示声明meta属性：，minimum-scale和maximum-scale主要作用是控制内容的显示比例。

iphone在使用css3的时候，要通过-khtml为前缀的方式，-webkit的方式不管用。比如：-khtml- border-radius

iphone不支持css的inline-block属性

iphone 没有:hover状态，不过可以通过iphone的ontouchstart和ontouchend两个js事件来模拟触屏特效，比如上面展示了搜索结果展示的list和按钮样式变化的情形，我都是用js来实现的。不过这也有个不可避免的问题，就是iphone默认有这么个触屏效果，虽然可以在ontouchstart和ontouchend事件中通过return false可是实现，但是这取消了链接或者按钮默认的功能，这个需要衡量。(javascript示例代码如下)

1 2 下一页