尺寸响应？双端适配？盘点那些备受迫害的网页们

up主的收藏都很酷炫啊[支持]

♥ 26 ↩ 7

我:强行锁定documentElement尺寸和比例，使用百分百位移到页面中心，这样在任何设备上的展示效果都是一致的[doge][doge][doge]

♥ 17 ↩ 6

我是用vue-router中间件去识别屏幕然后进入不同模板，然后做两套UI，一套PC一套mobile[doge]

♥ 12 ↩ 4

我们是pc pad mo分别适配，要写三套样式，jojo可以看看oppo和一加的官网随便找一个手机的产品站看看 也是海外版的产品站比国内做得更炫酷一些[doge]

♥ 9 ↩ 3

我的网站做了全平台弹性盒响应，所以元素都有适配，性能优化主要在动画部分，高性能平台的特效主要使用模糊和透明度，部件的封装也是尽量通用，逻辑尽量简单，有兴趣可以来看看，我试试链接能不能发出来

♥ 5 ↩ 4

终于有适配的视频了，之前写官网不太懂可折磨了[喜极而泣]

♥ 5 ↩ 2

canvas简单些，我是将canvas的宽高与设备像素比关联，然后通过像素比缩放画布解决移动端高DPI屏模糊的问题， 然后简单媒体查询移除例如shadowBlur这些动态绘制时耗能大的， 虽然大部分手机都不至于看个网页会卡，但是有的就会，例如我那把harmony系统的对于浏览器的渲染管线方案老旧即使是轻便的动态阴影都会导致卡顿。对于竖向的就是减少高度，增加一个视口的内容，对于横向的就是改为竖向。 webgl就麻烦，因为手机的GPU真的…，容易做的就是阉割功能。

♥ 4 ↩ 1

1

♥ 4 ↩ 10

才刷到QAQ

♥ 3 ↩ 3

我都是不同环境写多套代码[doge]，

♥ 2 ↩ 3

随便开一个都卡卡的，我16G内存还是小了吗[笑哭]

♥ 2 ↩ 3

王者那个的作品应该是只有移动端。 直接横过来是为了适配手机开启了锁定旋转屏幕的情况。 这样同时可以省略提示内容，也避免用户还要多一步操作去开启手机横屏功能[doge]。

♥ 2 ↩ 1

如果只是让网页适配不同分辨率的显示器，用什么办法呢

♥ 1 ↩ 1

图片尺寸还好说，难弄的是字体响应

♥ 1 ↩ 1

用 canvas/webgl 做移动端适配复杂度是指数级的提升，带来的回报甚至没达到线性，阉割掉移动端的效果其实是情理之中的事情。而且其实国外用移动端 web 的场景/用户习惯其实非常落后，这也导致扫码这种行为在国外非常少

♥ 1 ↩ 1

[doge]

♥ 1 ↩ 1

来啦

♥ 1 ↩ 1

我想問問要怎麼在1個HTML內檢測用戶使用的客戶端類型並據此顯示不同的網頁內容. (起步者, 當時在搜怎麼做transition動畫找到的這個頻道)

↩ 1

话说根据根字体动态变化这种主要面向pc端是不是挺常见的🧐

↩ 6

一键三连了jiejoe感谢更这一期

↩ 1