定位困難

我試圖定位兩個圖像並遇到困難。我想要'歡迎'！講話泡泡就在標誌的左側。定位困難

有人可以幫助我嗎？

這裏是我的代碼：

html { 
 
\t background-color: #FFFFFF; 
 
} 
 

 
img { 
 
\t width: 100px; 
 
\t height: 150px; 
 
} 
 

 
#logo { 
 
    margin: auto; 
 
    width: 10%; 
 
} 
 

 
#welcome { 
 
    margin: auto; 
 
    width: 10%; 
 
} 
 

 
#popUp { 
 
\t width: 50px; 
 
\t height: 50px; 
 
}

<! DOCTYPE html> 
 
<html> 
 
\t <head> 
 
\t \t <title>Placehold</title> 
 
\t \t <link rel="stylesheet" href="css/stylesheet.css"/> 
 
\t \t <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script> 
 
\t </head> 
 
\t <body> 
 
\t \t <div id='logo'> 
 
\t \t \t <img src="http://i1377.photobucket.com/albums/ah72/michaelbarley1/logo_zpsopheofmw.png" alt="logo"> 
 
\t \t </div> 
 
\t \t <div id='welcome'> 
 
\t \t \t <img id='popUp' src="http://i1377.photobucket.com/albums/ah72/michaelbarley1/welcome_zps3xaw6gge.png" alt="welcome"> 
 
\t \t </div> 
 
\t </body> 
 
</html>

來源

2016-03-14 Kōdo no musō-ka

一個簡單的辦法是切換HTML的順序，使泡歡迎DIV是標誌DIV之前。你所要做的就是將每個div浮動到左邊。

html { 
 
\t background-color: #FFFFFF; 
 
} 
 

 
img { 
 
\t width: 100px; 
 
\t height: 150px; 
 
} 
 

 
#logo { 
 
    margin: auto; 
 
    width: 10%; 
 
    float:left; 
 
} 
 

 
#welcome { 
 
    margin: auto; 
 
    width: 10%; 
 
    float:left; 
 
} 
 

 
#popUp { 
 
\t width: 50px; 
 
\t height: 50px; 
 
}

<! DOCTYPE html> 
 
<html> 
 
\t <head> 
 
\t \t <title>Placehold</title> 
 
\t \t <link rel="stylesheet" href="css/stylesheet.css"/> 
 
\t \t <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script> 
 
\t </head> 
 
\t <body> 
 
\t \t <div id='welcome'> 
 
\t \t \t <img id='popUp' src="http://i1377.photobucket.com/albums/ah72/michaelbarley1/welcome_zps3xaw6gge.png" alt="welcome"> 
 
\t \t </div> 
 
\t \t <div id='logo'> 
 
\t \t \t <img src="http://i1377.photobucket.com/albums/ah72/michaelbarley1/logo_zpsopheofmw.png" alt="logo"> 
 
\t \t </div> 
 
\t </body> 
 
</html>

來源

2016-03-14 15:04:44 Wowsk

非常感謝你，這解決了我的問題。 –

回答

相關問題