2015-09-14 51 views
0

我看了看,但我無法找到它。請解釋爲什麼類中的圖像:secondimage在下面的代碼中根本沒有移動。不應該所有的div都以相同的方式移動,不管它們是否有文字或圖像?感謝您的任何幫助。移動一個div裏面的圖像?

<head> 
<style> 
html, body{ 
    margin: 0; 
    height: height: 100%; 
    } 
h1, h2, h3{ 
    font-family: "Arial", Helvetica, sans-serif; 
} 
.topp{ 
    margin-right: 500px; 
    background-image: url('gamerbeta.jpg'); 
    background-color: fff; 
    width: 100%; 
    height: 450px; 
    float: top; 
    box-shadow: 3px 3px 4px black; 
} 

.second{ 
    position: relative; 
    top: 0px; 
    background-color: white; 
    width: 100%; 
    height: 450px; 
    box-shadow: 3px 3px 4px black; 
} 
.secondword{ 
    position:absolute; 
    top: -50px; 
    left: 450px; 
    font-size: 50px; 
} 
.secondp{ 
    position:absolute; 
    top: 10px; 
    left: 1100px; 
    text-align: center; 
.secondimage{ 
    position: absolute; 
    top: 50px; 
    left: 1200px; 
} 

    .third{ 
    position: relative; 
    background-color: white; 
    width: 100%; 
    height: 450px: 
    box-shadow: 1px 1px 4px black; 
    } 
</style> 
</head> 

<body> 
<div class=topp></div> 

<div class=second> 
    <div class=secondword><h1>BETA</h1></div> 
    <div class=secondp><h2>EXCLUSIVE ACHIEVEMENT<br>FOR JOINING BETA</h2></div> 
    <div class=secondimage><img src="test.jpg" alt=""></div> 
</div> 

<div class=third> 

</div> 

</body> 
+0

需要移動的位置? –

+1

我不明白你的問題是什麼,你的CSS在'.secondp'塊中有一個錯字(缺少'}')。 – j08691

+0

我不明白爲什麼某些東西應該「移動」。以上所有代碼都是靜態的,沒有找到「移動」代碼。 – shaochuancs

回答

0

您在「secondp」類之後缺少右括號。希望這可以幫助。

0

它看起來像一個語法錯誤。我建議在發佈之前做的第一件事是通過像W3C這樣的檢查器/驗證器來查找錯誤或運行代碼。當我們沒有發現我們的錯誤時,它可以創造奇蹟。嘗試https://jigsaw.w3.org,你可以看到你的CSS的所有問題。

0

也許如果你關閉支架} .secondp這將有所幫助。另請閱讀有關使用absolute的位置,您可能會更好使用relative