凉薄非本意 2022-09-18 12:06 采纳率: 70%
浏览 13
已结题

html移动端如何dpi适应

我有一个html移动端的设计稿图是19201080的，但我发现当移动设备的dpi为160时，css设置19201080是刚刚好的,可以铺满整块屏幕，如果dpi大于160时，css设置的宽高就会变得很大，但是两台设备的分辨率都是1920*1080的，只是dpi不同而已，有没有什么办法能不重新编写css的情况下适应不同的dpi啊
设备160dpi时的显示样子：
所有的内容能够全部显示

img


设备320dpi时的显示样子：
只有显示部分内容了，之前的宽高在这个dpi下变的很大

img

  • 写回答

0条回答 默认 最新

    报告相同问题？

    • (141)_HTML手机电脑网站_网页源码移动端前端_H5模板_自适应响应式源码.zip
      2023-08-02 16:27
      HTML手机电脑网站_网页源码移动端前端_H5模板_自适应响应式源码.zip这个压缩包文件包含了构建现代网站所需的重要资源，特别是针对移动设备优化的网页设计。在这个压缩包中，我们可以找到一个名为“天字一号网络 (141...
    • 前端移动端web开发（一）
      2021-09-14 16:41
      whisper49的博客 也叫“套壳开发”，通过写特定的代码生成跨平台的web app，可以用一些前端native开发框架或者是在移动端网页的基础上打包生成app。 移动端web app开发 web app比较接近客户端应用程序的用户体验，可以和系统深度...
    • ✨移动端基础知识合集
      2022-07-21 21:37
      睡觉的巧克力的博客 移动端基础，包括相关基础知识，Flex、rem、响应式布局
    • html+css移动端布局
      2022-03-21 16:59
      D之光的博客 文章目录移动端一、移动端基础**1 .浏览器现状****2 .手机屏幕现状****3.常见移动端屏幕尺寸****4.移动端调试方法**5.总结二、视口**1.布局视口** `layout viewport`**2.视觉视口**`visual viewport`**3.理想视口** ...
    • Web笔记-移动前端开发笔记
      2020-02-16 18:11
      IT1995的博客 因为最近有个移动端的小项目，在此稍微学习下移动端开发基础概念。免得用框架的时候莫名其妙。 px(CSS pixels)：逻辑像素，浏览器使用的抽象单位； dp,pt(device independent pixels)：设备无关像素； dpr...
    • 移动端屏幕适配
      2025-04-25 06:00
      前端熊猫的博客 移动端屏幕适配
    • 前端面试题之html css篇
      2023-03-28 18:45
      WY_ALA的博客 移动端的布局用过媒体查询吗？ 70.CSS优化、提高性能的方法有哪些？ 1.什么是盒模型 当我们对一个文档进行布局的时候，浏览器的渲染引擎会根据标准之一的css基础的盒模型，将所有的元素表示为一个个的矩形的盒子 一...
    • 前端学习笔记 - 移动端Web开发
      2021-10-18 22:17
      茗0309的博客 移动端基础 浏览器现状 PC端常见浏览器：360浏览器、谷歌浏览器、火狐浏览器、QQ浏览器、百度浏览器、搜狗浏览器、IE浏览器 移动端常见浏览器：UC浏览器，QQ浏览器，欧朋浏览器，百度手机浏览器，360安全浏览器，...
    • html不同屏幕适应rem,一步步教你使用rem适配不同屏幕的移动设备
      2021-06-29 00:35
      weixin_39737951的博客 1.先说说几个前端常用的几个单位的概论：1、px (pixel，像素)：是一个虚拟长度单位，是计算机系统的数字化图像长度单位，如果px要换算成物理长度，需要指定精度DPI(Dots Per Inch，每英寸像素数)，在扫描打印时一般...
    • 前端移动端适配总结
      2023-02-13 16:26
      Michael18811380328的博客 前端移动端适配总结 阅读约 19 分钟 meta标签到底做了什么事情 做过移动端适配的小伙伴一定有遇到过这行代码： <meta name="viewport" content="width=device-width, initial-scale=1.0"> 但是，很多小伙伴...
    • 手淘解决移动端适配问题（flexible）
      2018-09-27 17:07
      在移动互联网快速发展的今天，移动端适配已经成为网页设计和开发中的关键问题。...在实践中，开发者还需要不断学习和适应新的前端技术，如Web Components、CSS Grid、Flexbox等，以便更好地应对未来的移动端适配挑战。
    • 【前端布局篇】响应式布局 Bootstrap 移动端布局
      2023-06-20 16:33
      MagnumHou的博客 网页布局：利用html搭建结构与内容，使用CSS添加装饰网页布局有很多种方式，一般分为以下几个部分：头部区域、菜单导航区域、内容区域、底部区域。**注：**所有的页面布局都是基于盒子模型基础之上进行布置。响应式...
    • 前端viewport手机屏幕适配
      2023-05-09 15:17
      weixin_39116980的博客 参考 基于Viewport的移动端web屏幕基本适配方案详解_viewport适配_。烦啦的博客-CSDN博客 Android屏幕适配总结_android 屏幕适配_此非梦亦...移动端前端适配方案（总结）_前端浏览器适配_小草莓蹦蹦跳的博客-CSDN博客
    • 移动端几种做前端适配的方法讲解
      2016-05-19 17:27
      h330894169的博客 3.适应响应式布局来做，用媒体查询，具体的可以参考bootstrap，  弊端:冗余代码较多，要做多个分辨率的适配，css代码写的较多。个人不太建议使用这种，除非用成熟的bootstrap框架节省一些工作量。   4...
    • 前端系列-移动端开发踩过的一些坑
      2020-08-08 15:56
      web修理工的博客 移动端开发通用坑 vue移动开发特有坑以及小技巧分享 移动端开发性能优化 一、移动端开发通用坑 1、click300ms延迟？ 讲道理，现在开发移动端基本是不会有这么一个问题的。但作为移动端以前的经典坑，我这里也拿出来...
    • web前端--移动端适配总结
      2019-03-08 15:43
      A18088356665的博客 做过移动端适配的小伙伴一定有遇到过这行代码： 但是，很多小伙伴只是感性的认识：噢，我加了这行代码，然后页面的宽度就会跟我的设备宽度一致。然而，这种理解是很片面的。那么，这句话的本质到底是什么呢？ 不急...
    • 【CSS】CSS移动端适配与响应式布局全面指南
      2025-11-16 17:03
      Doris893的博客 本文系统介绍了移动端开发的核心技术与适配方案。主要内容包括：1) 移动端基础概念，如视口设置与像素比；2) 主流适配方案，详细解析vw/vh和rem两种单位的使用方法及转换公式；3) 响应式布局实现方式，包括媒体查询...
    • 没有解决我的问题, 去提问

    问题事件

    • 系统已结题 9月26日
    • 创建了问题 9月18日