微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

css – 在响应式设计中使用%单位有什么意义?

我正在重新设计我的网站,因为在不同的分辨率(分开的设备)上看起来很糟糕,大多数指南和教程依赖于%和em而不是固定值.我还在学习这个,所以我正在读周围的一切.

认为这将解决具有不同显示尺寸的问题,但又一次:我们必须制作更多的CSS来修复某些特定问题.

如果我需要为额外的显示尺寸添加媒体查询,为什么要使用%呢?使用%真的减少编码吗?是否需要为某些尺寸添加一些额外的CSS或我做错了什么?

谢谢你的建议!

解决方法

使用em大小的目的是允许您的设计基于用户选择的字体大小.我可能会使用更大的字体,因为我有一个巨大的显示器和视力不佳,而其他人可能更喜欢较小的字体.通过使用em单元,您的设计将适应我们的字体首选项并相应地调整大小,而不是将字体大小强制为给定标准(例如“12点字体”).

以类似的方式,百分比(%)单位允许您的设计响应不同的浏览器大小.与em单位结合使用,这将允许基于文本的元素响应任意字体大小选择,并允许布局元素响应任意浏览器大小.

为所有媒体类型设计单一的响应式设计是完全可以接受的. Media queries是在不同设备上需要不同的显示样式时使用,而不是“支持”不同的显示尺寸.一个例子是在印刷媒体上使用衬线字体,在显示媒体上使用无衬线字体,因为可用性研究表明这些字体面是这些类型媒体的首选.

此外,它允许您为某些情况(如移动设备)执行自定义样式,您可能需要考虑用户的带宽有限,并且可能会减少额外的图像.或者,如果您想以完全不同的布局显示您的内容,以便为某些手机提供的微观屏幕.

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。