文本自动字体大小

发布于 2024-11-14 01:22:36 字数 253 浏览 3 评论 0原文

我有一个标题的 div 标签,如下所示,它可能是多行的,我希望文本尽可能大,以便整齐地放入框中。感谢您的任何想法。

<div id="main" style="width:700px; height:165px; float:left; font-size:50px; text-align:center; font-family:Chiller;"><?php echo $title ?></div>

I have a div tag for a title, as below, it may be multi lined and I would like the text to be as big as possible to fit neatly in the box. Thanks for any ideas.

<div id="main" style="width:700px; height:165px; float:left; font-size:50px; text-align:center; font-family:Chiller;"><?php echo $title ?></div>

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

屋顶上的小猫咪 2024-11-21 01:22:36

我不会为您编写代码,但我确信您可以使用 javascript 或 jQuery 来完成。您需要设置您在那里编码的 div 的溢出属性。并且您需要为已有的 div 内的标题文本创建一个单独的 div。然后使用 javascript 检查内部 div 的高度是否大于外部 div 的高度。我还没有尝试过,但是是这样的:

<div id="main" style="width:700px; height:165px; float:left; font-size:50px; text-align:center; font-family:Chiller; overflow:hidden;">
    <div id="title"> 
        <?php echo $title ?> 
    </div>
</div>

然后在 javascript 中,您只需检查 title 的高度或宽度是否大于 main 的高度或宽度。如果是,请减小字体大小并再次检查,直到适合为止。我可能会隐藏标题 div 直到获得正确的字体大小。

本文也可能有所帮助:http://objectmix.com/javascript/112045-check -overflow-div.html

I won't code it up for you, but I'm sure you could do it with javascript or jQuery. You'd want to set the overflow property of the div you have coded there. And you'd want to create a separate div for the title text inside the div that you already have. Then with javascript you can check to see if the height of the inner div is greater than the height of the outer div. I haven't tried it, but something like this:

<div id="main" style="width:700px; height:165px; float:left; font-size:50px; text-align:center; font-family:Chiller; overflow:hidden;">
    <div id="title"> 
        <?php echo $title ?> 
    </div>
</div>

Then in the javascript you just check to see if the height or width of title is greater than the height or width of main. If it is, you decrease the font size and check again until it fits. I would probably hide the title div until I get the right font size.

This article also might help: http://objectmix.com/javascript/112045-check-overflow-div.html

哽咽笑 2024-11-21 01:22:36

我没有时间对此进行测试,但我发现这两个链接可能会帮助您:

调整窗口大小时自动调整文本大小(字体大小)?

http://icodesnip.com/snippet/jquery/jquery-automatic-text-resize

I don't have time to test this but I found these two links that might help you out:

auto resize text (font size) when resizing window?

and

http://icodesnip.com/snippet/jquery/jquery-automatic-text-resize

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文