我在標題居中的HTML頁面上獲得了標題（h1）。肖像模式可讓圖像在標題上方，並且在將方向改爲橫向時，我希望圖像位於標題的左側。使用方向檢測來確定圖像的位置

我試過<br>結合@media屏幕和(orientation:portrait/landscape) 和不同的設置沒有任何進展。如果我使用浮動左邊的圖像仍留在上面的標題等行我真的不知道該怎麼解決呢..

<!DOCTYPE HTML> 
<html> 
<body> 
<h1><img>"picture"</img><br>Car</h1> 
</body> 
</html>

有沒有人有什麼建議？

2012-11-06 Dean.V

小提琴或您的代碼將有所幫助 –

它基本上只是用於測試。 '<！DOCTYPE HTML>

＃
汽車

' @ Mr.Alien 讓我們說這是爲肖像模式，我希望把標題「汽車」旁邊的IMG在它的左側。 h1以css爲中心。使用@media屏幕和（方向：人像）我認爲... –

希望這段代碼能幫到你。

HTML代碼

<h1><img src="img.jpg" /> <span>Call</span></h1>

CSS代碼爲普通視圖

h1{ 
    text-align:center; 
} 
h1 img{ 
    display:inline; 
} 
h1 span{ 
    display:block; 
}

CSS代碼爲橫向視圖

h1 span{ 
    display:inline; 
    background-color:#3CF; 
    position:relative; 
    top:-25px; 
}

根據圖像高度調整頂部位置。

2012-11-06 19:19:58

謝謝！我其實也做了同樣的事情！阻止並內聯以獲得效果。 –

使用方向檢測來確定圖像的位置