html font-size 根元素一般设置多少px啊?

html font-size 根元素一般设置多少px啊?

# 具体遇到的问题
记得前面有一期课程说设定一个40还是多少来着 方便计算?还是什么意思
# 报错信息的截图

# 相关课程内容截图

# 尝试过的解决思路和结果

# 粘贴全部相关代码,切记添加代码注释(请勿截图)

在这里输入代码,可通过选择【代码语言】突出显示

正在回答

登陆购买课程后可参与讨论,去登陆

3回答

同学你好,问题解答如下:

1. 在移动端适配的课程中:
http://img1.sycdn.imooc.com//climg/5fa0b8e20942cded13310299.jpg
我们提到过,将html的fontsize设置成40px计算会比较方便,即40是html的font-sise大小。原因是设计稿是750px的,它对应着iphone6,即实际开发时,设计同学会以iphone6的屏幕为基准,进行设计页面,然后我们利用该设计稿,将机型调整iphone6,对着该机型写代码。当元素在设计稿上是100px时,换算成rem就是100/40=2.5rem(2.5rem才是我们需要写的数值),即40这个数值,相对来讲,是比较利于计算的。
2. 截图中的代码是媒体查询,only是媒体查询的关键字,它用来指定某种特定的媒体类型,可以排除不支持媒体查询的浏览器,即符合关键字only的机型,并且宽度符合要求的页面,会被应用媒体查询中的样式。
3. 这里利用媒体查询实现动态改变html的font-size和之前利用js,效果是一样的,插件的根元素值,设置方式也是一样的。设置时,要参考设计稿,比如设计稿是375px的,利用之前的js得到页面的html的fontsize是20px,那么编辑器也要设置成20px;如果利用此处的媒体查询,则html的fontsize是100px,那么编辑器的字体大小要设置成100px,即编辑器的根元素要与html的fontsize大小一致。
4. 之前的课程中,讲到的方案更灵活。但是此处的方案也不是错的,原理是一样的,只是写法不用,同学可以把此处当成扩展来学习。
祝学习愉快!

提问者 陈立天 2020-11-02 22:03:13

我有点不理解 他这里用媒体查询 动态的去变化这个根元素的font-size了。。  那之前用的插件cssrem 到底把设置里面的根元素值设置成多少???

  • 提问者 陈立天 #1
    我记得这个根元素的font-size 有一期视频讲到好像可以根据视口宽度来计算根元素的font-size值 应该比这个根据固定宽度尺来做媒体查询 的响应式更加灵活把?? 我忘记是在哪期课程讲到了
    2020-11-02 22:25:06
提问者 陈立天 2020-11-02 21:48:05

看到后面有给这个根元素设置font-size的。。我想问个问题:

这个是媒体查询把??  圈出来的这个语法是什么意思呢?

http://img1.sycdn.imooc.com//climg/5fa00e05096434e025391438.jpg

问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师