如何让字体在固定最大宽度和最大高度的容器内随字体多少在一行内自适应?
高洛峰
高洛峰 2016-10-28 14:01:26
[HTML讨论组]

1.png

1.png

如图:红色方框内是允许的最大高度和最大宽度,当里面有一个字的时候,高度要最大;当多个字的时候并且超出宽度时,可以自适应地缩小。我们公司安卓掉好像用webview固定宽度高度就可以原生自适应,PC-WEB有没有简单快捷的实现方式?思路、代码demo都可以,求大牛解答。

高洛峰
高洛峰

拥有18年软件开发和IT教学经验。曾任多家上市公司技术总监、架构师、项目经理、高级软件工程师等职务。 网络人气名人讲师,...

全部回复(1)
三叔

以前写的一段代码,思路在注释,里面的h4只是针对注释而言。兼容IE6以上。

/*    
 *    范围内的文字自动缩小字号
 *    autoFontSize($o)
 *    @param    $object    指向

的em  *    需要双层结构,如

text

,且h4 要有white-space: nowrap;,em是行元素  *    读取em自动撑开的宽度,em宽度比h3宽时就会调整  */ autoFontSize: function($o) {     var iCW = $o.width(),         $p = $o.parent(),         iPW = $p.width();          if (iCW > iPW) $o.css('fontSize', iPW * parseInt($p.css('font-size')) / iCW );    //h4宽度 / ( em宽度 / h4默认字体大小) },


热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号