Html-理解前端开发中单位(em单位和rem单位)和网络地址

em

em 是CSS2引入的相对单位,作为字体大小使用时和百分比单位类似,都是相对于最近的父元素设置字体大小,为标签元素设置字体大小为100%和设置字体大小为1em是一样的效果,默认情况下浏览器的字体大小为16px,这样只要浏览器默认的字体大小不变,1em = 16px
Document

可可
可可
可可
可可
可可

效果图

px

一般我都是使用px来设置我们的文本,因为它比较稳定和精确。但是px本身却存在一些问题,当用户在浏览器我们的页面时,如果他改变了浏览器的字体大小,这时会使我们的Web页面布局被打破。这样的话对于关心网页布局展示的用户来说,这就是一个必须解决的大问题。因此,就提出了使用em来定义Web页面的字体。

rem

rem root em,CSS3新增的相对单位,相比于其他CSS3单位(ch,vw,vh,vmax,vmin)移动端兼容性强,android2.1+,iso4.1+。作用和em类似,唯一的区别就是em是相对父元素的,rem是相对html根节点的,即所有使用rem单位的子元素的字体大小都是相对根节点的。
Document
可可
可可

vw、vh
Document

相关推荐
指针向南3 分钟前
Chrome读不了HEIC怎么办:原生解码和WASM两条路
前端·图像处理·人工智能·chrome·计算机视觉·wasm
默_笙42 分钟前
🚥 给 RAG 装一台心电监护仪:LangSmith 全链路观测(上)
前端·javascript
前端snow2 小时前
ai agent --- mem0 外挂记忆系统
前端
变与不变8062 小时前
js同步和异步难点重点详解
开发语言·javascript·ecmascript
特立独行的猫a3 小时前
用仓颉写一个 Tauri:IPC 的每次往返实现原理(web层到仓颉层的触发过程)
前端·ui·harmonyos·tauri·鸿蒙·仓颉
Dovis(誓平步青云)3 小时前
多个链接不等于多份证据,新闻核验看板怎样合并来源
java·服务器·前端·javascript·人工智能·pdf·电脑
骑着蜗牛撵大象3273 小时前
Qt 事件机制详解:从 QEvent 派生类到事件过滤器的全景指南
前端·python
qq_2518364573 小时前
理发管理系统 —— 会员模块
开发语言·前端·python·flask
Dovis(誓平步青云)3 小时前
几个方案来回选不定?做一个随时切换的候选推荐页
android·java·服务器·开发语言·javascript·数据库·智能化
Frag0ut4 小时前
2027 年浏览器展望:Chrome 与 Edge 的 AI 智能体进化方向
前端·人工智能·chrome·edge·浏览器·新功能