我可以根据字母数量更改字体大小吗？

本文介绍了我可以根据字母数量更改字体大小吗？的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我有一个显示用户名的框。不过，我发现它只能容纳10个字母 - 我使用标准的 h1 字体大小。

有没有办法根据字母数来更改 font-size ？我的用户名范围为3到10个字符。

解决方案

请尝试下面的代码。

 < html> 
< head> 
< script src =http://code.jquery.com/jquery-latest.js>< / script> 
< script language =javascript> 
 
 $（函数（）{
 var len_fit = 10; //根据你的问题，10个字母可以放入。
 var un = $（'＃user_name'） ; 
 
 //获取用户名的长度
 var len_user_name = un.html（）。length; 
 if（len_fit< len_user_name）{
 
 //计算新的字体大小
 var size_now = parseInt（un.css（font-size））; 
 var size_new = size_now * len_fit / len_user_name; 
 
 //将新的字体大小设置为用户名。
 un.css（font-size，size_new）; 
} 
}）; 
< / script> 
< / head> 
< body> 
< h1 id =user_name>您的长名称< / h1> 
< / body> 
 
< / html>

我希望这可以帮到你。

I have a box which displays the username. However I found that it can only fit 10 letters - I use the standard h1 font size.

Is there a way to change the font-size according to the number of letters? My usernames range from 3 to 10 characters.

解决方案

Please try the code below.

<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script language="javascript">

    $(function() {
        var len_fit = 10; // According to your question, 10 letters can fit in.
        var un = $('#user_name');

        // Get the lenght of user name.
        var len_user_name = un.html().length;
        if(len_fit < len_user_name ){

            // Calculate the new font size.
            var size_now = parseInt(un.css("font-size"));
            var size_new = size_now * len_fit/len_user_name;

            // Set the new font size to the user name.
            un.css("font-size",size_new);
        }
    });
</script>
</head>
<body>
    <h1 id="user_name">Your Long Name</h1>
</body>

</html>

I hope this could help you.

这篇关于我可以根据字母数量更改字体大小吗？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！

LETTERS

我可以根据字母数量更改字体大小吗？

问题描述