jquery - Fittext 给了我奇怪大小的标题

Question

我正在使用 Fittext 来调整网页上的文本大小，但是当我尝试在标题标签中选择 h1 选择器的两种不同用途和在 Flexslider 中使用另一种用途时，我得到了奇怪的结果。

在页面标题上：

<header><h1>A Main Heading</h1></header>

在 Flexslider 设置中：

<ul class="slides">
<li>
    <article class="slide">
        <div>
            <a href="http://www.#.co.uk"><img src="_/images/thumb.jpg" alt="#" /></a>
        </div>
        <header><h1>Flexislide Heading</h1></header>
        <div class="slide-content">
            <p> some text </p>
        </div>
        <footer class="entry-meta">
            <p> some meta text </p>
        </footer>
    </article>
 </li>
</ul>

Fittext 调用：

// Fit Text
$().ready(function() {
$("h1").fitText(0.9);
$("h2").fitText(1.2);
$("h3").fitText(1.2);
$(".slide header h1").fitText(2.2);
});

根据第二个 h1 中有多少个字母，单词以不同的大小出现，有些非常适合其他短单词显得很小？

我想知道是否有更好的方法来调用第二组 h1 标题，或者是否与它们在 Flexslider 中使用有关？

Answer 1

也许考虑 h2-5 可能是更好的使用元素，因为看起来您在两种非常不同的情况下使用 h1。