根据屏幕大小动态设置字体rem

//根据屏幕大小动态设置字体rem

var docEl = document.documentElement,//当设备的方向变化（设备横向持或纵向持）此事件被触发。绑定此事件时，//注意现在当浏览器不支持orientationChange事件的时候我们绑定了resize 事件。//总来的来就是监听当然窗口的变化，一旦有变化就需要重新设置根字体的值resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',recalc = function() {//设置根字体大小let maxWidth = 750let cw = docEl.clientWidth>maxWidth ? maxWidth : docEl.clientWidthdocEl.style.fontSize = 10 * (cw / 320) + 'px';};//绑定浏览器缩放与加载时间
window.addEventListener(resizeEvt, recalc, false);
document.addEventListener('DOMContentLoaded', recalc, false);

根据屏幕大小动态设置字体rem

根据屏幕大小动态设置字体rem相关推荐

el-table 根据屏幕大小动态设置max-height来自适应表格的最大高度出现滚动条
根据element-ui的文档,max-height的合法的值为数字或者单位为 px 的高度.无法识别响应式的css,如: max-height:calc(100vh - 40px) //或者 max ...
WPF中GDI+图形图像的绘制：（一）绘制文本——动态设置字体、大小、颜色
GDI+(Graphics Device Interface Plus图形设备接口加)是.NET框架的重要组成部分,负责在屏幕和打印机上绘制图形图像和显示信息.GDI+不但在功能上比GDI 要强大很多 ...
移动端应该如何动态设置字体大小？
rem由来:font size of the root element,那么rem是个单位,单位大小由它第一代老祖宗的font-size的大小决定.现在前端码农们为了能在各个屏幕上看到一个健康的网页在 ...
由于微信字体大小的设置导致rem布局的微信公众号页面发生错乱的问题总结
微信应用中由于字体设置的问题导致的页面错乱适配上一篇文章中总结了在手机端怎么通过rem 动态设置html 的fontSize 值,解决手机端的适配问题,但是在微信中有一个特例. 一般情况下,在rem ...
pyqt5动态设置字体大小
利用QFontDialog组件的getFont()方法进行字体的设置下面是使用工具栏按钮绑定设置字体的方法进行界面字体设置,设置完成后并进行本地化保存,界面重启时进行加载利用下面的方式进行工具栏按 ...
Android根据屏幕大小动态适配GridView
前言: 最近有个需求上面有图片,下面是个类似九宫格的列表,列表下面还有文字,刚开始只有3列还可以布满,后面改了需求有4列,在小屏手机就没有铺满,第4列看不到了,修改图片和文字长宽也没适配,后面想到利用 ...
css设置个性字体大小,css设置字体大小的属性名是什么
css设置字体大小的属性名是"font-size",该属性使用css中表示尺寸的单位(px.em.rem等)设置字体大小,也可以使用百分号等单位来设置.实际上font-size设置 ...
根据屏幕大小自适应根字体大小
首先获取根节点 var html = doc.getElementsByTagName("html")[0], (orientationchange->手机屏幕转屏事件) ( ...
php字体大小_php设置字体的方法
php设置字体的方法发布时间:2021-02-14 08:44:07 来源:亿速云阅读:75 作者:小新这篇文章主要介绍了php设置字体的方法,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家 ...

根据屏幕大小动态设置字体rem

根据屏幕大小动态设置字体rem相关推荐

最新文章

热门文章