html - Safari 上的字体大小不一致

Question

我的字体大小在 chrome 和 firefox 上都很好。在 safari 上查看时，事情完全走下坡路。字体很大。

http://codepen.io/anon/pen/GZEdXZ

<section>
    <div class="row">
        <div class="row-sm-height">
            <section class="col-sm-6">
                <a href='@Url.Action("Top6GolfTerms", "Golf")'>

                </a>
            </section>
            <aside class="col-sm-6">
                <div>
                    <span> <a id="Article_Category">Golf</a></span>
                    <h2 id="Article_Header2">
                      <a id="Article_Title">
                     UFC Champions: The 5 Most Influential Fighters That Will Go Down Into UFC History
                      </a>
                    </h2>
                </div>
            </aside>
        </div>
    </div>
   <hr>
</section>

<section>
    <div class="row">
        <div class="row-sm-height">
            <section class="col-sm-6">
                <a href='@Url.Action("MostInfluentialUfcFIghters", "MMA")'>

                 </a>
            </section>
            <aside class="col-sm-6">
                <div>
                     <span> <a id="Article_Category">UFC</a></span>
                     <h2 id="Article_Header2">
                      <a id="Article_Title">
                     UFC Champions: The 5 Most Influential Fighters That Will Go Down Into UFC History
                      </p>

                    </h2>
                </div>
            </aside>
        </div>
    </div>
    <hr>
</section>

我尝试了多种方法，例如将文本大小更改为 % 而不是使用 px。我尝试使用 text-rendering:optimizeLegibility;

在 Chrome 上 http://snag.gy/K7BjL.jpg在 Safari 上 http://snag.gy/kOXad.jpg

Answer 1

从我从这些屏幕截图中看到的情况来看，您遇到的问题是字体发生了变化。据我所知，即使设置为相同大小，也并非所有字体的大小都相同。尝试不同的字体系列。