2012-11-03 91 views
-1

爲什麼我的主頁寬度爲1024像素。之後的每一頁都有1280像素的寬度?即使是全屏,這也是它的加載方式。爲什麼?主頁的加載方式與其他頁面不同

規格: 瀏覽器:Chrome 位於本地機器上的頁面。 HTML很簡單這裏是三網融合

root { 
    display: block; 
} 
#leftcol a{text-decoration: none;} 
#leftcol{ 
    left: 10%; 
    width: 200px; 
    height: 100%; 
    margin-top: 0px; 
    position: absolute; 
    opacity:0.6; 
    color: white; 
    font-size: 2em; 
} 
#left-placeholder{ 
    height: 100%; 
    width: 10%; 
    float: left; 
} 
#left-pusher{ 
    height: 100%; 
    width: 200px; 
    float: left; 
} 
.left-column-item{ 
    background: url('images/bgnav.jpg'); 
    height: 33.334%; 
    background-size: 100%; 
    opacity:0.6; 
    color: white; 
} 
.left-column-item:hover{ 
    background: url('images/bgnav.jpg'); 
    height: 33.334%; 
    background-size: 100%; 
    opacity: 1; 
} 
#content{ 
    text-align: center; 
    color: white; 
    font-size: 5em; 
    height: 100%; 
    width: 70%; 
    float:left; 
} 

body{ 
    background: url('images/background.jpg'); 
    background-size: 100%; 
    margin: 0; 
    min-height: 100%; 
    width: 100%} 
html, body 
{ 
    height: 100%; 
} 

// HTML網頁爲:

<html> 
    <head> 
     <title></title> 
     <LINK href="styles.css" rel="stylesheet" type="text/css"> 
     <script type ="text/javascript"> 

     </script> 
    </head> 
    <body> 
      <div id ="leftcol"> 
       <a href="content/practice.html"><div class ="left-column-item">Practice!</div></a> 
       <a href="content/AboutUs.html"><div class ="left-column-item">About Us!</div></a> 
       <a href="content/contactUs.html"><div class ="left-column-item">Contact Us!</div></a> 
      </div> 
     <div id="left-placeholder"></div> 
     <div id ="left-pusher"></div> 
     <div id ="content">Math Practice Site<br>Welcome</div> 
    </body> 
</html> 

//未正確加載

<!DOCTYPE html> 
<html> 
    <head> 
     <title></title> 
     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
     <LINK href="../styles.css" rel="stylesheet" type="text/css"> 
     <script type ="text/javascript"> 

     </script> 
    </head> 
    <body> 
      <div id ="leftcol"> 
       <a href="practice.html"><div class ="left-column-item">Practice!</div></a> 
       <a href="aboutUs.html"><div class ="left-column-item">About Us!</div></a> 
       <a href="contactUs.html"><div class ="left-column-item">Contact Us!</div></a> 
      </div> 
     <div id="left-placeholder"></div> 
     <div id ="left-pusher"></div> 
     <div id ="content">Math Practice Site <br> hello</div> 
    </body> 
</html> 
+3

你將不得不提供更多的信息,比如你的代碼,瀏覽器類型等。 – greener

+0

可以請你分享您的主頁代碼。這將有所幫助。 – Unpredictable

+0

現在upvote請 –

回答

2

它將實踐頁如果你可以發佈一個鏈接到你的網站,那就太棒了...... 看起來你是以不同的方式引用你的樣式表。嘗試使用該索引呼叫其他網頁:中

<LINK href="styles.css" rel="stylesheet" type="text/css"> 

代替

<LINK href="../styles.css" rel="stylesheet" type="text/css"> 

你可能會調用一個完全不同的樣式表。

您也可以嘗試收縮身體的寬度而不是使用%

body{ 
background: url('images/background.jpg'); 
background-size: 100%; 
margin: 0; 
min-height: 100%; 
width: 1024 px;} 
+0

如果能解決您的問題,您可以提出我的答案嗎?謝謝! :) –

相關問題