將圖像固定在右上方，但設置了最小頁面寬度

我試圖在頁面的右上方貼上標註圖像，但我不希望它在屏幕低於某個寬度時移動，否則會開始重疊其他頁面元素。有沒有人知道這是怎麼回事？謝謝！將圖像固定在右上方，但設置了最小頁面寬度

2012-09-28 user1706745

標準CSS實踐告訴我們，頁面上的每個元素應該被封裝成塊：

<div style="float:left;"> 
    <div style="float:left;"> 
     <img src="picture.png" /> 
    </div> 
</div>

這種風格讓elelments堆疊在彼此，防止重疊的頂部。

對你來說，這聽起來像你有一個頭，你需要固定在右上角的圖片：

<div id="header" style="width:100%;float:left;"> 
    <div style="float:right;"> 
     <img src="picture.png" /> 
    </div> 
</div> 

<!-- continue stacking elements to build your page --> 

<div id="content" style="width:100%;float:left;"> 
    Hey, this stuff works! 
</div>

但是你也提到你的頁面應該有一個最小寬度，這樣，當一個用戶試圖收縮寬度，元素不會水平重疊：

<body style="min-width:800px;"> 

    <div id="header" style="width:100%;float:left;"> 
     <div style="float:right;"> 
      <img src="picture.png" /> 
     </div> 
    </div> 

    <!-- continue stacking elements to build your page --> 

    <div id="content" style="width:100%;float:left;"> 
     Hey, this stuff works! 
    </div> 

</body>

來源

2012-09-28 15:56:50

將圖像固定在右上方，但設置了最小頁面寬度

回答

相關問題