html网页缩小之后,部分样式乱掉,字体不会跟随网页缩放而改变大小。求解?

今天闲来无事想模仿腾讯课堂敲个网页,结果敲到一半网页缩小时字体样式炸了。有部分字体变成了两排。图中可以看到,宽度我设置的是百分比。到底是啥原因?字体我用的rem,
另:如果是字体不会随着网页改变大小而造成样式乱掉的问题又该怎么解决pc端网页字体大小自适应的问题。
腾讯课堂的页面不管怎么缩小都不会炸,样式也不会乱掉?此处是我写的网页
图片说明
----------------------------------------漂亮的分割线-------------------------------
此处是我腾讯课堂的网页
图片说明

5个回答

在html顶部加

 <meta name="viewport" content="width=device-width, initial-scale=1.0">

字体会随页面的变化而变化

首先,我想问问你rem的根目录html的字体你有用@media做自适应大小变化吗?其次我想问你这个乱掉的样式的宽度是不是用百分比来弄的?如果是,那页面缩小了,宽度不足够时自然是要掉下来的,我觉得像这种可以固定宽度的,你可以给个min-width来设置它的最小宽度

qq_26969485
qq_26969485 昨天回家用火狐浏览器试了一下,发现不管怎么缩小都没有样式乱掉,但是在谷歌上就不一样了。另外@media pc端怎么做媒体查询?没用过?
2 年多之前 回复

是不是绝对定位的问题?position=“absolute”,改成相对定位或者浮动定位试试

qq_26969485
qq_26969485 不是定位的问题,位置上就是几个a标签我让他左浮动了。宽度不够就变成两排,不知道怎么解决。
2 年多之前 回复

在html顶部加
字体会随页面的变化而变化

建议页面固定宽度,字体用rem

Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!