在HTML里，由於瀏覽器顯示器等差異，瀏覽器的寬度也會有變化，為了適應不同的寬度，需要用到平鋪。
例如頁面前面的固定的條等，如果是純色，可以用背景色，如果不是純色，是漸變等，可以用條狀圖平鋪。
常見的布局方式一般有table和div，如果需要單個圖片和漸變平鋪都需要，則不能放到一個td里，或一個div里。
可以的形式：
圖片是固定大小的：
div(固定寬高，盛放圖片）div(盛放條狀平鋪）兩個div並排float。
div(固定寬高，背景圖）div(盛放條狀平鋪）兩個div並排float。
div(盛放條狀平鋪），div(固定寬高，背景圖）嵌套進前的div。
例如前面博文（相關博文：），頁面上面的條狀，為了方便管理，上面的元素統一放到大分區里名字叫header的div里，可以給header平鋪漸變的條狀圖，該大div設置為100%，然后里面嵌套一個小div盛放圖片，這里盛放的是背景圖。
這樣header的div里就有了本身平鋪的條狀背景圖，和嵌套在里面的小div的背景圖。
代碼：
</head> <body> <div id="header" style="background-image:url(images/topb2.jpg);width:100%;height:200px;"> <div style="background-image:url(images/topb1.jpg);width:176px;height:200px;"></div> </div> 省略。。。。。 <div id="footer" style="background-image:url(images/bom2.jpg);width:100%;height:200px;clear:both;"> <div style="background-image:url(images/bom1.jpg);width:176px;height:200px;"></div> </div> </body>
圖示：
但是這種切片方式，如果后期需要改的話，而前面的圖片沒有分層的情況下，不好改。
如果有分層圖備份的話，直接替換背景漸變再切兩個也比較麻煩，但是比沒有分層圖備份要容易。
如果是用上訴方式，要改漸變，就要改兩張圖，切條和圖片都要改，沒有分層還有把圖片選區處理，但圖片一旦合成，由前面的博文（相關博文：PS弧形邊緣的去黑色背景色）可知，越復雜的圖片越難分層還原回去，再選區回分層圖就有誤差。
所以還可以這樣做，漸變和圖片分開，這樣改圖就改圖，不動漸變，改漸變就改漸變，不需要改圖，兩者分開，就更容易修改了。
需要改漸變，只需要做個漸變，切個條，需要改圖，就可以把透明圖改掉。
這種情況下，可以嵌套div，也可以分兩個div，一個背景圖漸變平鋪並且盛放那個透明圖，但是這樣修改漸變平鋪要修改兩個div的背景。
嵌套可以只修改一次，大div盛放背景漸變，內部小div盛放透明圖（或把透明圖設置成背景圖）
簡單點說，就是背景平鋪和圖片分開，這樣改哪個只改一個就行。
