2015-10-15 51 views
0

我正在構建一個響應式網頁,並且希望將我的頁面的字體設置爲100%,但導航文本保持一致。我認爲通過媒體查詢瞄準導航字體大小會做到這一點,然後我認爲增加重要會起作用,但可悲的是,沒有運氣。既然你希望所有的頁面上的字體是除了要設置你的百分比錯nav元素100%字體大小100%,例外

@media (max-width: 950px) { 
    body {font-size:95%;} 

    nav {font-size:100% !important;} 
} 
+0

難道你有你的百分比倒退?不應該是100%,導航是95%?你能對你想要的效果做更精細的闡述嗎? – Adjit

+0

我希望我的網頁中的每一種字體都能根據我在媒體查詢中定義的百分比來調整大小,除了導航字體之外,不管屏幕大小如何調整,導航字體都保持相同的大小(100%)。我可以在每一個媒體查詢中爲每一種字體寫下規則,但我認爲這不是很有效或很好的做法,所以我正在尋找另一種解決方案。 –

+0

你是什麼意思你希望導航文本保持一致?這是否意味着像14px這樣的特定大小?請澄清 – tam5

回答

1

。另外,不確定爲什麼您在媒體查詢中擁有此設置。

爲了理解下面的例子中,你需要了解通過設置,因爲你有身體font-size設置爲150%navfont-size95%現在你設置的150%navfont-size至95%,這將相當於142.5%。字體大小的百分比是相對於他們的父母。

這裏是我建議:

#navContainer { 
 
    font-size: 150%; 
 
} 
 

 
nav { 
 
    font-size: 95%; 
 
} 
 

 
#standalone_Nav nav { 
 
    font-size: 142.5%; 
 
}
<div id="navContainer"> 
 
    <div>This is body text at 150%</div> 
 
    <nav>This is Nav Text at 95% of 150%</nav> 
 
</div> 
 

 
<div id="standalone_Nav"> 
 
    Standalone standard text 
 
    <nav>Nav text set at 142.5%</nav> 
 
</div>

+0

感謝您幫助我理解這一點,現在我的導航字體就像一個魅力。 –

0

移動nav {font-size:100% !important;}任何媒體查詢外部

+0

這是一個很好的想法,但沒有運氣。 –