iPhone呈現斜體標記（<i></i>）tiny

我們發現iPhone的斜體標記呈現出現問題。當爲其定義的font-family與其父母的font-family不同時，斜體文本渲染比應該小得多。這個問題似乎沒有出現在所有的iOS設備上，只有iPhone（至少是版本4 - 6）。iPhone呈現斜體標記（<i></i>）tiny

測試：http://www.eyesforward.com/etc/italic-fail.html

<!DOCTYPE html> 
<html> 
    <head> 
    <style type="text/css"> 
    body { 
     font-family: serif; 
    } 
    i { 
     font-family: Arial; 
    } 
    </style> 
    </head> 
    <body> 
    <p> 
     "The freaking thing <i>works</i>," Strong said with amazement, punctuating this key verb with his hands like an orchestra conductor giving a downbeat. "It's beautiful. It does exactly what we wanted it to do." 
    </p> 
    </body> 
</html>

http://i.stack.imgur.com/Arh20.png

來源

2015-01-21 Josh

當您使用不同的字體系列，如襯線與宋體這裏，你應該期待* *在字形大小的差異，即使在字體大小是一樣的。通常，Arial字形比典型的襯線字體字形大*。我想知道iPhone是否會通過自動使用較小的字體來彌補這一點。在任何情況下，在印刷的理由，字體家庭不應混合在文本段落，或至少你應該選擇*匹配*字體。 – 2015-01-21 08:22:32

嘗試設置字體大小的身體和斜體元素，看它是否修復該問題：

<style type="text/css"> 
    body { 
     font-family: serif; 
     font-size: 16px; 
    } 
    i { 
     font-family: Arial; 
     font-size: 16px; 
    } 
</style>

然後嘗試只設置它爲身體，看看問題是否仍然存在。每個瀏覽器都有自己的樣式規則，適用於各種元素。

來源

2015-01-21 03:02:30

試試這個：

<style type="text/css"> 
    body { 
     -webkit-text-size-adjust: none; 
    } 
</style>

來源

2015-01-21 03:54:08

iPhone呈現斜體標記（<i></i>）tiny

回答

相關問題