Full Screen in Web Studio
Web Studio 5 Tutorials and Add On's - supporting you take your website that next step

Repeat Image for full screen

 Remember to donate if you use a tutorial - Thank-you for help with maintaining the website and for understanding my time

A small image that repeats right across the full screen
You can use a tall image that tiles right and fades it into your background color or use bands of colors
This works for all desktop and mobile browsers, and is similar to the methods shown in the CSS section

The image I'm starting with for the example is 257px wide X 1000px high then CSS repeats it to your screen width
When you use large images optimize them for download you can read more about image use in the CSS section
I try to optimize my image download size to be as close to 40KB as possible this example image is 20KB


You can place text or other images on top of these since they are just typical website backgrounds
You could place a DRAW TAB SHAPE on your page and change it's opacity in the CREATE TAB to make it transparent
Other options are to use a screen wide (transparent) banners like I did here with the colored (black and gray) backgrounds
You would fade into black and used a black background or any color you like so it looks like a full height image 
I use a wide screen banner to go back to my site theme colors in this example (to show the image) you wouldn't do that normally.
You can always ask me on the WSnext forum if you have any questions

Name your image 1.jpg and
Attach it to "website properties"

On the HTML tab in Insert Page HTML
copy/paste this into Inside HEAD

<style type="text/css">
body {background:#000000 url(1.jpg) 0 100px repeat-x;}

NOTE: You put this at the top in the HEAD
before any other style so it loads first

Customize the Code

#000000 - will be the color of your page background
1.jpg - is the name of the image you attached
100px - is how far down the image starts
0px would be the top for example

Preview to see it work


A small example of
the image I'm using

Web Studio 5 - How to repeat an image to fill the entire screen - by Web Studio Next