Coder Social home page Coder Social logo

两个移动端疑问 about weflow HOT 6 CLOSED

13714273163 avatar 13714273163 commented on June 30, 2024
两个移动端疑问

from weflow.

Comments (6)

littledu avatar littledu commented on June 30, 2024
  1. 目前用的是 Iphone6 的尺寸 375 作为基准啊,没有问题。可以修改代码里面 html 根节点的基准值更改任意你想改的。

  2. 需要用到 background-size 是二倍以上的图,如果你的 slice 目录下有 @2x.png 的图,是会自动生成一张 [email protected] 的精灵图的,代码也会自动生成相应的 background-size,如:

image

from weflow.

13714273163 avatar 13714273163 commented on June 30, 2024

1.目前设计稿主流都是750呀~,另外对于不用媒体查询,而是用js设置rem的项目好像没考虑到噢(简单来说就是要设置75px=1rem怎么做呢)。
2.对于问题2,在750宽度设计稿时,如果用@2x的图,width和height对应生成的数值不对,您懂得哈。
这两个问题归根结底是因为375与750的设计稿吧,当初没考虑到这个问题,毕竟外面大部分项目都是750设计稿的哟(没法传图,重新发了封邮件带图的到您qq邮箱请查收)

from weflow.

littledu avatar littledu commented on June 30, 2024

看来你还是不明白,375 的二倍就是 750,你好好看 example 研究研究吧

from weflow.

hzlzh avatar hzlzh commented on June 30, 2024
  1. rem 和 px 之间的换算公式和比例是可以自己决定的,不一定非要 75px = 1rem,可以通读一下这个篇文 http://www.alloyteam.com/2016/03/mobile-web-adaptation-tool-rem/#prettyPhoto
  2. 如果要使用 rem 解决方案,建议放弃 雪碧图 拼合方案,转而用 HTTP 2.0 的特性不在合并图片到一张里。否则会触发 rem 与 雪碧图的 bug,导致计算结果有小数而造成的 Icon 毛边

from weflow.

13714273163 avatar 13714273163 commented on June 30, 2024

px和rem转换公式和比例都是知道的,现在是自己陷入到另外一些问题上了,再琢磨一下,总之多谢两位。

from weflow.

hzlzh avatar hzlzh commented on June 30, 2024

@13714273163 rem 方案已经很完善了,主要的大坑在于要抛弃雪碧图使用,多亏有 HTTP 2.0 来解救

from weflow.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.