设计稿常见尺寸宽度

àì夳堔傛蜴生んèń 2023-01-11 09:12 154阅读 0赞

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDQ0NTM2Mw_size_16_color_FFFFFF_t_70]  
附媒体查询代码：

@baseSize: 75;
    
    html { 
        font-size: @baseSize;
    }
    
    @media screen and (min-width: 320px) { 
        html { 
            font-size: 32px;
        }
    }
    
    @media screen and (min-width: 360px) { 
        html { 
            font-size: 36px;
        }
    }
    
    @media screen and (min-width: 375px) { 
        html { 
            font-size: 37.5px;
        }
    }
    
    @media screen and (min-width: 384px) { 
        html { 
            font-size: 38.4px;
        }
    }
    
    @media screen and (min-width: 400px) { 
        html { 
            font-size: 40px;
        }
    }
    
    @media screen and (min-width: 414px) { 
        html { 
            font-size: 41.4px;
        }
    }
    
    @media screen and (min-width: 500px) { 
        html { 
            font-size: 50px;
        }
    }
    
    @media screen and (min-width: 640px) { 
        html { 
            font-size: 64px;
        }
    }
    
    @media screen and (min-width: 720px) { 
        html { 
            font-size: 72px;
        }
    }
    
    @media screen and (min-width: 750px) { 
        html { 
            font-size: 75px;
        }
    }

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDQ0NTM2Mw_size_16_color_FFFFFF_t_70]: /images/20221119/5e32b8902b5f441da360bb9f42c263f2.png

发表评论取消回复

表情：

评论列表（有 0 条评论，154人围观）

还没有评论，来说两句吧...

相关阅读

相关常见设计稿字体对应字重font-weight大小

拿到 UI 设计稿时，可以经常看设计稿中常见的字体有 *PingFangSC-Regular*、*PingFangSC-Medium*、*PingFangSC-Bold*...

系统管理员/ 2024年04月17日 15:15/ 0 赞/ 62 阅读

相关设计稿常见尺寸宽度

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ub

àì夳堔傛蜴生んèń/ 2023年01月11日 09:12/ 0 赞/ 155 阅读

相关 rem 针对设计稿宽度，设计rem调试比例

rem 针对设计稿宽度，设计rem调试比例一, 网易适配方法 > 屏幕宽度/设计稿rem宽度=页面动态font-size值 (function(do

淩亂°似流年/ 2023年01月06日 13:59/ 0 赞/ 193 阅读

相关 php 图片长宽,php获取图片尺寸(宽度,高度)

语法：array getimagesize( string filename \[, array &imageinfo\] ) 功能：getimagesize()函数将测定任

迈不过友情╰/ 2022年11月13日 04:05/ 0 赞/ 213 阅读

相关设计稿750px 配置rem

设计稿750px 配置rem > 获取设备宽度 > >750 等于750 > <320 等于320 > 设置字体大小设备宽度/7.5 1rem=100像素

桃扇骨/ 2022年08月29日 09:38/ 0 赞/ 262 阅读

相关界面设计之尺寸篇

转载自[站酷][Link 1]，原文链接http://www.zcool.com.cn/article/ZNjUzODg=.html\ ![SouthEast][]

怼烎@/ 2022年08月25日 08:49/ 0 赞/ 119 阅读

相关移动端 - CSS使用的尺寸与设计稿（PSD）保持一致

文章目录像素概念 CSS中使用的尺寸与设计稿(PSD)保持一致 > [https://wildye.cn/posts/d1676c71/][https_w

布满荆棘的人生/ 2022年05月27日 04:57/ 0 赞/ 246 阅读

相关常见贴片元器件封装尺寸

SMD贴片元件的封装尺寸公制：3216——2012——1608——1005——0603——0402 英制：1206——0805——0603——0402——0201——01

系统管理员/ 2021年11月22日 06:12/ 0 赞/ 2319 阅读

相关移动端H5页面的设计稿尺寸大小规范

当我们在做手机端H5网页设计稿时（当然包含微信端的H5网页设计），如果没有做过类似的移动端的设计，UI设计师和前端工程师肯定会纠结的。如果是app设计师，就不会那么纠结啦。

Myth丶恋晨/ 2021年11月10日 12:48/ 0 赞/ 332 阅读

相关微信小程序，修改按钮Button尺寸（宽度或高度）

当前版本的微信小程序，在.wxss文件里设置Button宽度无效，例如： button { width:48rpx; height: 48rpx

墨蓝/ 2021年07月24日 23:49/ 0 赞/ 2338 阅读