Step 1: Create a rectangle using the shape tool. Make it whatever color you want; I chose blue since we're making a wave.

Step 2: With the rectangle selected, click Filter -> Distort & Transform -> Zig-Zag

Step 3: The default settings are okay, but you can play with the settings to adjust the height of your wave. Make sure the preview box is clicked if you want to see what will happen to your rectangle.

Step 4: With the shape selected, click on Object -> Expand Appearance. We do this because illustrator treats the shape like it's still a rectangle after you apply the zig zag filter. Expanding the appearance converts your shape into an object with its own control points, allowing us to directly manipulate the path.

Step 5: Now, we want this to repeat, so we need to just take a portion of our shape. Luckily for us, the Zig Zag filter spaces out all of the waves evenly in a sine-wave type pattern, so we can pick a start point and end point to make an image that will repeat nicely when we use it in our HTML/CSS. Here we need to use the direct selection tool (the white arrow, not the black one...or hit "A" if you're into hotkeys) and select the wacky, wavy end of the shape.

Step 6: Hit the delete key to remove the junk from the end. But now, the path is open, and we want to close it! Grab the pen tool (P for the hotkeyers) and click on the top point (a little / should appear next to the pen nib) and then click on the bottom point (a little o should appear) to close the path up. This is helpful for the next step.

Step 7: Get the direct selection tool out again, and this time select the junk to the right. Make sure you draw a box to the right of the center of the next trough or "low point" after the crest, or "high point" of the wave. You'll notice that everything left of the crest is half of a trough, and everything to the right is another half. This is how we create a seamlessly repeating pattern.

Step 8: Delete the junk, and you'll see we have a single crest. If you want just a wavy ribbon, you can stop here, but I needed a boxy bottom to my wave since it was going to be used in a page footer. If you want to keep following along, go ahead and close the ends with the pen tool like we did in step 6.

Step 9: Use the direct selection tool to grab the lower center point of the shape. This picture here shows that a white square should show up, indicating that you can select the point.

Step 10: Delete it! This will square up the bottom of your wave, making it ideal for a border of any kind. Here, you can change the color, add a gradient, or copy and paste it into photoshop to do more work on it. Read on for a couple more steps on how to publish it using Illustrator if you don't have Photoshop, or prefer to use only Illustrator.

Step 11: Click the crop artboard tool. This will make the area outside the artboard turn gray, indicating that you are resizing the visible area of the final image.

Step 12: Illustrator will handily crop the artboard automatically for you to fit everything into the image. So, just click on the wave, and voila! It'll resize the artboard to perfectly contain your wave.

Step 13: Select any other tool to close the crop artboard tool. You can now save the file for web use using File -> Save for Web and Devices. This will optimize the file for web use. You can save it in any format you wish, but I would recommend using GIF or PNG, since they support transperency, and they use "lossless" compression, so that we don't have to worry about "artifacting" the edges of our wave.