文本自动字体大小

发布于 2024-11-14 01:22:36 字数 253 浏览 11 评论 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>

分享到QQ

分享到微博

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

发布评论

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

屋顶上的小猫咪 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

回复收藏 0 原文