此標題區域如何在所有瀏覽器上運行？

Question

我剛看到這個瀏覽器的位置：

http://www.dietriffic.com/

現在，在頂部的綠色部分，無論我怎麼重新大小我的瀏覽窗口（瀏覽器），它管理的完全或只是填充沒有顯示全部。它是如何做到的？這是一個形象吧？他們不可能爲每個屏幕尺寸做好準備嗎？

謝謝！

Answer 1

它使用horizontally- and vertically-repeated image整個首部的寬度：

和一個居中的，非重複的，mostly-transparent PNG用於在首部的中間的那個發光效果：

Answer 2

使用Firebug：

The green bo x是

<div id="header_area" class="full_width"> 

它使用重複的背景圖像，他們使用與「磚」填補了整個DIV尺寸50×50的（綠色）。該DIV總適合的瀏覽器窗口寬度的事實是類「全角」：

.full_width { 
    clear: both; 
    width: 100%; 
} 

它是一條什麼比例的width: 100%。

除此之外，居中的文字不是圖像，而是真實的文字。他們實現與集裝箱元件上的中心對齊

margin: 0 auto; 

。