post #1 of 1
Thread Starter 
CSS tutorial :: How to make a nice background fast


In this tutorial we will learn:

  • How to make nice backgrounds in a few minutes.


How to make nice backgrounds in a few minutes.


It's amazing how much I see people fret over backgrounds. They can spend hours upon hours doing it. I'm going to show you a way to produce nice, browser compatible backgrounds.

So, first thing first, point your browser to stripegenerator. In the box named "stripe color," simply enter "f8f8f8" without the quotations. You can change the stripe width and shadow to your liking. Now reload the picture and view your creation. You should probably change the orientation so it's going vertical/ up and down the way.

We have now took the first step in designing the background. Now you want to download it, using the button labeled 'download' underneath the glimpse of the stripes. Make sure that once downloaded you place the file in the folder with the HTML document you want to use it with. This is essential as if not, the browser won't be able to find it. Now you will want to right click on the file and change it's name to 'stripe.jpg'

To use it, simply place this in between your head tags:
Code:
<head>
<style type="text/css">
body
{
background-image: url('stripe.png');
}
</style>
</head>

As you can see this is a simply way to create nice, unobtrusive backgrounds that works across most if not all browsers. Have fun!

Any questions, comments, queries? Post here or PM me thumb.gif

Josh
Edited by joshd - 3/27/12 at 11:37pm
Main Rig.
(14 items)
 
Battlefield 2 review.
Battlefield 2 PC Game EA
 
CPUMotherboardGraphicsRAM
Bulldozer FX4100 Gigabyte GA-M68MT-S2 MSI 7770 Kingston Hyper X | 2 x 2 GB 
Hard DriveOptical DriveCoolingOS
WD 2 TB  LiteON DVD/CD R-W Drive AMD Standard cooler Windows 7 Ultimate 
MonitorKeyboardPowerCase
32' Luxor Full HD TV Microsoft comfort curce Antec 450 Watt OcUK Value case 
MouseAudio
Microsoft wireless mouse Logitech speakers & Bass 
  hide details  
Reply
Main Rig.
(14 items)
 
Battlefield 2 review.
Battlefield 2 PC Game EA
 
CPUMotherboardGraphicsRAM
Bulldozer FX4100 Gigabyte GA-M68MT-S2 MSI 7770 Kingston Hyper X | 2 x 2 GB 
Hard DriveOptical DriveCoolingOS
WD 2 TB  LiteON DVD/CD R-W Drive AMD Standard cooler Windows 7 Ultimate 
MonitorKeyboardPowerCase
32' Luxor Full HD TV Microsoft comfort curce Antec 450 Watt OcUK Value case 
MouseAudio
Microsoft wireless mouse Logitech speakers & Bass 
  hide details  
Reply