Lol, its very simple really. Its a nice HTML 'trick' that you use an image with 1px width and 300px height, then that will repeat itself till the whole table is filled, so you actually get one smooth looking image, that really just is one simple 1px width bar that keeps repeating itself.
so you will end up with something like X × 1px width bgfiller (that repeating image of 1px width) | the banner with the same background, but this time its one image, not a lot of 1px images| again a piece of X × 1px bgfiller, till the entire top of the page is filled..
The reason why it is '1px' is so you can have a variable width. Some people use smaller screen resolutions, in which case they will see something like this: 12x 1px filler | the banned with the same background (798px width) | 12x 1px filler --> this thing is 822 pixels wide
And when you have a higher resolution you will see something like: 300x 1px filler (so thats 300 px width in total)|the banned, still 798px| again the filler of 300x 1px filler (so again 300 px width in total). --> this whole thing is 300+798+300= 1398 pixels wide
So the original banner will stay the same width, but the TOTAL width can change with that simple, but VERY usefull trick. So when you change your screen resolution to something smaller the variable pieces (the 1px bars that keep repeating themselfs X times) will repeat themselfs less--> banner in total width will be smaller --> it will perfectly fit your screen.
If you change your screenresoluti on to something higher the variable pieces will repeat themselfs more --> the total banner width will increase and it will still perfectly fit your screen.