学到现阶段,在调整浏览器大小,设计手机端页面的时候,字体会无法根屏幕的改变而自适应改变。最近在设计页面的时候又碰到这种问题,就决定把碰到的这类问题在这里一个个记下来:
1.自适应字体大小
我自己使用字体单位的改变过程如下:px,rem,vmin
前面两个都是固定大小,最后一个是可以自适应的单位;
一开始用了vh或者vw来设置,但是后面发现无法在宽高各自变换时实现适应;
后来查到还可以使用vmin这个单位
vmin表示:根据当前视图的宽高的最小值来进行取值;这样一来就可以
实现针对一项变化来适应字体的 大小;
2.关于p标签会带有的文本换行空间的效果,在网上查到可以对父标签设置font-size:0;
然后再给p设置大小就可以实现,试了一下结果发现还是不行;后面试了一下给p设置
margin:0;再检测发现边距去除了;
这里并不知道在哪里还需要用到,我是在设置p在父标签内居中时受到这个问题的影响
而无法居中,所以使用了这个方式;
3.关于行内块元素也会带有换行空间的实现对其去除的方式,就是给其设置font-size:0;
比如img标签;这是有效的.
4.关于字体在容器缩小后换行解决;
给父元素设置大小:可以是固定大小,也可以是响应大小,min-width/height;