將頁面向下移動以允許標題圖形

我正在使用一個程序，該程序允許我在表格中的單元格中添加內容。但是，所有類型的內容都是允許的，所以我添加了一個對樣式表的引用，允許我重新編寫應用程序。將頁面向下移動以允許標題圖形

該應用程序通過我們公司內部的大多數IE8和IE10以及使用IE7模式的應用程序界面的Web瀏覽器進行訪問。因此，它必須與各種屏幕分辨率下的所有瀏覽器模式兼容。

我想要完成的是添加一個標題圖形，從未有過的頁面。佈局是這樣

<table width="60%"> 
    <tbody> 
     <tr> 
      <td> 
       Here is my content 
      </td> 
     </tr> 
    </tbody> 
</table> 
Rest of page content here

我希望頁眉圖像以覆蓋所述瀏覽器的頂部部分，因此我已插入的圖像

在HTML我到輸入

<img src="/pathtoimage.png" class="newhead">

CSS

.newhead 
{ 
    width: 100%; 
    position: absolute; 
    top: 0; 
    left: 0; 
    z-index: -100; 
}

由於圖形已從文檔流中移除，所以頁面內容的其餘部分想要明星在圖形後面。

由於圖形會根據瀏覽器大小（在寬度上按比例調整）來改變高度，因此內容需要向下移動相同的數量。

任何意見，如何最好地完成此讚賞。我一直在如何做到這一點，我已經費盡心思，並與IE7模式（我知道，我知道）

我一直在試圖使用60％寬度的標題圖形的透明圖像（相同的高度） - 這樣它會調整大小與標題圖形成比例），但得到它適當填補表，或保持60％，或根據計劃做任何事情已被證明是行不通的。

再一次，謝謝你的幫助

來源

2014-02-17 user3320324

我可以問你爲什麼使圖像絕對？我，讓它顯示：塊;位置：相對; max-width100％;'這樣就可以正確縮放，下面的內容將顯示在圖像下 –

我的代碼位於寬度爲60％的表格內。我無法改變這個 – user3320324

並且隨着你給定的代碼圖像延伸到身體邊緣？那太奇怪了。否則，你使用IE ...在我們考慮太多之前;）有沒有辦法通過js更改dom？ –

爲什麼讓位置是絕對的？您可以更改標題的一側，並將其壓低至您希望的大小。

.newhead 
{ 
    width: 100%; 
    display: block; 
}

，並在您希望的情況下襬脫默認的填充：

body 
{ 
    margin: 0; 
    padding: 0; 
}

來源

2014-02-17 18:42:46 lilwupster

無論瀏覽器的大小如何，我都希望圖形能夠在最頂端與瀏覽器窗口並排放置。這樣圖像不會填滿窗口，或者窗口太寬，具體取決於。 – user3320324

將圖像包裹在寬度爲100％的div中，以便圖像將展開以填充它。 – lilwupster

但該div仍在60％寬度表內 – user3320324

將頁面向下移動以允許標題圖形

回答

相關問題