2013-05-03 27 views
0

我正在處理我的頁面的CSS佈局,我只是遇到問題。在第一頁中查看導航欄加載所有走出低谷,但頁面刷新後,一切都看起來不錯,這裏有一個例子:第一次查看CSS加載奇數,頁面刷新後一切正常?

Before: 

Before

After: 

enter image description here

我不知道爲什麼會這樣做我對CSS很陌生,任何信息都會非常感謝!

這裏的CSS:

html, body { 
    margin: 0px; 

} 

.navbar-fixed { 
    background: -webkit-linear-gradient(top, #fff 0, #eee 85%, #ddd 100%); 
    border-top: 1px solid black; 
    border-bottom: 1px solid black; 
    border-radius: 3px; 
    box-shadow: 1px 1px 4px #e5e5e5; 
    position: fixed; 
    right: 0; 
    left: 0; 
    top: 0; 
    width: 100%; 
} 

.navbar-fixed ul { 
    display: inline-block; 
    margin: 0; 
    padding: 0; 
} 

.navbar-fixed ul li { 
    display: inline-block; 
} 

.navbar-fixed .logo a { 
    line-height: 50px; 
    padding: 0; 
    font-size: 32px; 
    letter-spacing: -3px; 
    transition: 0.3s; 
    font-weight: bold; 
    color: orange; 
    text-decoration: none; 
    text-shadow: 2px 2px 3px black; 
    margin: 0 2em 0 1em; 

} 

.navbar-fixed .logo a:hover { 
    text-shadow: 1px 1px 7px black; 
    color: white; 
    background: transparent; 
} 

.navbar-fixed ul.nav { 
    float: right; 
} 

.navbar-fixed ul.nav li a { 
    padding: 1em; 
    display: block; 
    color: #00AAEE; 
    cursor: pointer; 
    border: solid 0 1px 0 1px transparent; 
    transition: 0.5s; 
    text-decoration: none; 
} 

.navbar-fixed ul li a:hover, ul li.active a { 
    background-color: darkgrey; 
    border-color: #ccc; 
    color: white; 
} 

.container { 
    margin: 0 auto; 
    width: 70%; 
} 

.newswindow { 
padding: 1em; 
color: #fff; 
background-color: rgba(0, 0, 0, 0.75); 
position: absolute; 
bottom: 0; 
left: 0; 
} 

.newswindow h2 { 
    font-size: 42px; 
    border-bottom: 1px solid white; 
    letter-spacing: -2px; 
} 

.newswindow p { 
    font-size: 18px; 
} 
+2

我們需要看到的代碼。 – woz 2013-05-03 19:42:41

+0

你之前和之後都是空的......這個例子在哪裏? – 2013-05-03 19:43:06

+2

即使使用不同的瀏覽器? *總是**在第一個**視圖上?你確定這不是緩存問題嗎? – 2013-05-03 19:44:49

回答

1

一些特定瀏覽器的默認樣式可以干擾你定義的樣式。 (繼承樣式,默認詳細定義風格的某些元素...)

對於同質行爲在所有瀏覽器,使用一個CSS復位和正確定義所有需要的款式,不依賴於瀏覽器的默認設置。

這裏是一個很好的來源: http://meyerweb.com/eric/tools/css/reset/

相關問題