改變iphone方向

Question

時保持字體大小相同我用這個元標記

<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"> 

而且我有沒有寬度限制文本。
正文縱向分解爲兩行，當我旋轉設備時，文本被放大：不是保持相同的大小和使用可用空間，而是將文本放置在一行中，就像它應該那樣放大文本，文本仍然佔用兩行。

這是爲什麼？

的CSS（從SASS編譯）：

.text {color: #dee3d5; font-size: 16px; font-family: Helvetica; font-weight: bold; } 
@media screen and (orientation:portrait) { 
    .text { margin-top: 10px; margin-bottom: 10px; line-height: 20px; } } 
@media screen and (orientation:landscape) { 
    .text { margin-top: 5px; margin-bottom: 5px; line-height: 16px; } } 

#thanx { border-bottom: solid 2px #dee3d5; padding: 10px; margin: 0 10px 12px 10px; } 

Answer 1

您可以通過使用-webkit-text-size-adjust: none;禁用此行爲。

body { 
    -webkit-text-size-adjust: none; /* Prevent font scaling in landscape */ 
}