爲什麼網站不縮小到目標分辨率

我想要設計成不管目標分辨率有多低，我的網站都會縮小以適應整個屏幕而不需要向下滾動。我使用了%值，以適合任何目標分辨率。

這是網站的設計與所有主要屬性。 site design description

我的問題是，當我使瀏覽器的分辨率很小，內容不縮小以適應屏幕。

這是我收縮瀏覽器分辨率時發生的情況。 Boom 這是怎麼發生的？

下面是CSS屬性

#myPageBody 
{ 

    padding: 3% 15% 5% 15%; 
} 

#myPageNav 
{ 
    text-align: center; 
    padding:0%; 
    margin-bottom:2%; 
    font-weight :bold; 
    font-size:150%; 
} 

#myPageNav span 
{ 

    padding-right:2%; 
} 

.page 
{ 
    position:fixed; 
    width:65%; 
    height:70%; 
    padding:1%; 
    font-size:200%; 

}

來源

2012-10-01 Anirudha

-1

嘗試在字體大小使用端。實際上，字體大小在開始時被加載...... 1ems = 100％

來源

2012-10-01 18:36:46

在圖片中，它看起來像在瀏覽器窗口也隨之增加，而不僅僅是HTML文檔。所以看起來他們實際上增加了屏幕分辨率，而不是窗口「分辨率」。 – Ian

當您縮小屏幕尺寸時，字體大小不會改變，因此它會像平常一樣佔用相同的空間並分解。

來源

2012-10-01 18:37:13 geekman

不錯的觀察..我從來沒有看過它..如何根據瀏覽器的分辨率來改變字體！ – Anirudha

@Anirudha http://blog.cloudfour.com/the-ems-have-it-proportional-media-queries-ftw/ – Giona

@GionaF謝謝.. – Anirudha

當您放大或縮小時，像素會根據其提供的百分比分別增加或減少。

先給max-width，min-width（在像素）max-height和min-height（在像素）屬性以它們。我可能是錯的，但這是一個很好的做法。

例如：

max-width:100%; 
min-width:1024px; /* The least resolution to be considered */ 
max-height:/*desired percentage or pixels */ 
min-height:800px; /* The least resolution to be considered */

來源

2012-10-01 18:37:20

我同意，但爲了動畫的頁面，我不能提供最小或最大..但你能告訴我如何使字體改變根據瀏覽器的分辨率因爲我認爲這是問題，因爲@ I-love-php – Anirudha

你的意思是保持它不變，雖然屏幕調整？ –

不是恆定的..我希望字體大小隨屏幕分辨率的變化而改變 – Anirudha

爲什麼網站不縮小到目標分辨率

回答

相關問題