如何检测浏览器所支持的最小字体大小

一般浏览器会存在支持的最小字体的概念，也就是说，当我们给标签设置字体样式比浏览器所支持的最小字体小，则会会显示最小字体的大小，而不会显示我们设置的字体样式的大小。
如何才能检测浏览器所支持的最小字体大小呢？

 <script>let pStyle = document.getElementById("p")pStyle.style.fontSize = '10px'function getstyle(obj, key) {if (obj.currentStyle) {console.log('currentStyle')return obj.currentStyle[key];} else {console.log('getComputedStyle')return getComputedStyle(obj, false)[key];}}console.log(getstyle(pStyle, 'fontSize'))</script>

如上图所示，我们可以首先设置字体的样式，然后可以通过getStyle函数来获取该对象的字体样式，如果不是和我们设置的不一致的话，则此时浏览器就不支持该字体大小。
如果我们想要设置更小的字体该怎么做?

<!DOCTYPE html>
<html><head><meta charset="utf-8" /><title>小字体方法</title><style>* {margin: 0;padding: 0;}p {font-size: 12px;}.small-font {-webkit-transform-origin-x: 0;transform: scale(0.5);}</style></head><body><p class="small-font">温馨提示</p><p>温馨提示</p>
</body></html>

可以使用transform: scale(0.5)来进行缩放

如何检测浏览器所支持的最小字体大小相关推荐

如何设置、检测浏览器所支持的最小字体大小？
转载设置浏览器字体大小说明:小于12px字体的设计,我们很少接触到,因为pc端那么大的面积,没有必要设计那么小.要是接触到这种设计,一年前的我往往会说:这个设计太搞笑了,pc端居然设计出来小于12 ...
中文版Chrome浏览器不支持12px以下字体的解决方案
中文版Chrome浏览器不支持12px以下字体的解决方案 Chrome 27之前的中文版桌面浏览器会默认设定页面的最小字号是12px,英文版则没有限制,主要是因为chrome认为汉字小于12px就会增 ...
[js] 用js写一个方法检测浏览器是否支持css3的属性
[js] 用js写一个方法检测浏览器是否支持css3的属性 var div = document.createElement('div'); console.log(div.style.transit ...
WebSocket API使用篇检测浏览器是否支持WebSocket(4)
WebSocket API是下一代客户端-服务器的异步通信方法.前面有三篇文章已经对WebSocket有了一些介绍,这里我总结了一下.我在使用WebSockets API过程中遇到的问题. 1.检测浏 ...
如何检测浏览器是否支持HTML5？
HTML5新特性: 用于绘画的 canvas 元素用于媒介回放的 video 和 audio 元素对本地离线存储的更好的支持新的特殊内容元素,比如 article.footer.header.n ...
检测浏览器是否支持WMP(Windows Media Player)
检测浏览器是否支持WMP(Windows Media Player) 来源:http://www.enjoyphp.com/2010/front/javascript/wmp-installe/ By ...
HTML5使用Geoloacation API检测浏览器的支持性
HTML5使用Geoloacation API检测浏览器的支持性在调用HTML5 Deolocation API函数前,需要确保浏览器支持此功能.当浏览器不支持时,可以提供一些替代文本,以提示用户升 ...
UC浏览器电脑版怎么设置字体大小 UC浏览器字体设置教程
对于一些视力不好的小伙伴进行浏览网页的时候,要是浏览器的字体更大些的话看着就会轻松多了,下面小编就为你带来UC浏览器字体设置教程. UC浏览器电脑版怎么设置字体大小: 打开UC浏览器,点击" ...
浏览器html5视频抓取,检测浏览器是否支持html5视频的代码
复制代码代码如下: 函数checkVideo(){if(!!document.createElement('video').canPlayType){varvidTest=document.crea ...
（一）检测浏览器是否支持websocket
二.创建一个支持 WebSocket 的服务 1.从pywebsocket下载mod_pywebsocket(亲git clone),地址在这里啦~,这里请注意,mod_pywebsocket需要py ...

如何检测浏览器所支持的最小字体大小

如何检测浏览器所支持的最小字体大小相关推荐

最新文章

热门文章