pc端字体大小自适应几种方法

$(window).resize(function ()// 绑定到窗口的这个事件中

{

var whdef = 100/1920;// 表示1920的设计图,使用100PX的默认值

var wH = window.innerHeight;// 当前窗口的高度

var wW = window.innerWidth;// 当前窗口的宽度

var rem = wW * whdef;// 以默认比例值乘以当前窗口宽度,得到该宽度下的相应FONT-SIZE值

$('html').css('font-size', rem + "px");

});

$(function(){

var whdef = 50/750;// 表示750的设计图,使用50PX的默认值

var wH = window.innerHeight;// 手机窗口的高度

var wW = window.innerWidth;// 手机窗口的宽度

var rem = wW * whdef;// 以默认比例值乘以当前窗口宽度,得到该宽度下的相应FONT-SIZE值

$('html').css('font-size', rem + "px");

})

//REM适配
var _self =  this ;
        _self.width = 750;
        _self.fontSize = 100;
        _self.widthProportion =  function (){ var p = (document.body&&document.body.clientWidth||document.getElementsByTagName("html")[0].offsetWidth)/_self.width;return p>1?1:p<0.5?0.5:p;};
        _self.changePage =  function (){
        document.getElementsByTagName("html")[0].setAttribute("style","font-size:"+_self.widthProportion()*_self.fontSize+"px !important");
        }
        _self.changePage();
        window.addEventListener('resize', function (){_self.changePage();}, false );

转载于:https://www.cnblogs.com/zhouyx/p/9967941.html

pc端字体大小自适应几种方法相关推荐

pyqt5标签中的字设置不同字体_PyQt5 实现字体大小自适应分辨率的方法
最近遇到一个现象,将做好的软件放在更高分辨率的电脑上运行,会导致字体显示不完全,出现被控件遮挡的情况.具体原因可以上网查询,在这里将记录下解决方法. 这里记录两种方法,如果使用的Qt版本在5.6.0之 ...
html 字号自适应,html自适应网页里字体大小自适应屏幕的方法
html自适应网页里字体大小自适应屏幕的方法发布时间:2020-11-20 16:40:22 来源:亿速云阅读:216 作者:小新这篇文章主要介绍了html自适应网页里字体大小自适应屏幕的方法, ...
字体大小的设置_老年人用智能手机，怎样更改字体大小？3种方法，手把手教您学会...
分享生活小妙招,共享科技新生活!大家好,欢迎来到今天的知识分享!我是你们的好朋友小俊! 我们的老年朋友在使用手机时候都会觉得字体太小,导致使用起来非常不方便,那么今天我就教大家三种方法来设置字体大小, ...
苹果android在哪里设置字体大小,iPhone11字体大小怎么调？苹果手机调节字体大小的三种方法...
现在智能手机几乎是人手一部,就连我们身边的很多老年人也用上了智能手机.由于年龄的关系,老年人的视力一般都不太好.以苹果手机为例,如果用标准字体大小,老年人看上去就会很吃力.在这里介绍下如何在苹果手机上 ...
html字大小自适应,html字体大小自适应怎样让HTML字体自适应到移动端？
如何设置中的字体大小随 height变化而自 first line html如何实现字体大小的自适应字体的单位用百分比即可. html页面怎样能够自适应电脑屏幕宽度? 在1024*768或者800* ...
vue项目实现大屏PC端字体自适应
vue项目实现大屏PC端字体自适应我们字体自适应选择使用rem作为单位,通过监听窗口大小的变化,更新1rem的对应的px数来实现字体自适应. 注意该方法,我们需要在APP.vue文件中实现, 首先A ...
HTML设置字体大小自适应屏幕与echarts图表颜色根据数据大小实时刷新图表颜色
设置html文字大小根据页面大小自适应,在使用rem之前是使用的px和百分比,后来发现页面缩放或在小屏幕的电脑显示不尽人意,后改用rem,写法如:font-size: .21rem;或font-siz ...
python怎么把字体变大_Pycharm 字体大小调整设置的方法实现
一.pycharm字体放大的设置 File ->setting -> Keymap ->在搜寻框中输入increase ->Increase Font Size(双击) -&g ...
增加表空间大小的四种方法
增加表空间大小的四种方法 Meathod1:给表空间增加数据文件 ALTER TABLESPACE app_data ADD DATAFILE 'D:\ORACLE\PRODUCT\10.2.0\OR ...
hpux 下查看内存的的大小的几种方法：
hpux 下查看内存的的大小的几种方法: # /opt/ignite/binpa/print_manifest|grep Memory NOTE: Could not read the /etc/re ...

pc端字体大小自适应几种方法

pc端字体大小自适应几种方法相关推荐

最新文章

热门文章