使用CSS缩放文字 [英] Scaling text using CSS

问题描述

什么是，有没有一种方法可以使用CSS根据DIV中的文本量来缩放文本.

What is and is there a way scale text using CSS based on the amount of text within a DIV.

我已经在 http://www.directiongroup.com/tweethearts/创建了此页面，文本的CSS为(固定大小为32px):

I've this page I've created at http://www.directiongroup.com/tweethearts/ and the CSS for the text is (with a fixed size of 32px):

.jta-tweet-text

.jta-tweet-text

{
    color: #ed1c24;
    font-size: 32px;
    text-transform: uppercase;
    line-height: 30px;
    font-weight: normal;
    font-family: 'BebasNeueRegular', Arial, Helvetica, sans-serif;
    text-shadow: 0px 1px 0px #FFFFFF;
}

非常感谢

推荐答案

您不能仅使用CSS来做到这一点，但是可以用一点Jvascript来做到这一点.

You can't do this with CSS alone but you could do it with a bit of Jvascript.

计算文本中的字符数，并根据需要设置CSS font-size 属性.

Counting the number of characters in the text and setting the CSS font-size property as required.

这是一个使用jQuery的简单示例: http://jsfiddle.net/pjByL/

Here's a quick example using jQuery: http://jsfiddle.net/pjByL/

$('.heart').each(function(){
var textLength = $(this).text().length
    if(textLength > 26)
    {
       $(this).css('font-size', '10px');
    }
});

这篇关于使用CSS缩放文字的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！