You are invited to Log in or Register a free Frihost Account!

Using a pic as the main background of your page?

If someone used a pic as the background of their page(not tiled) and kept the pic inside a frame of the same size-600x800. and had a black background outside of that,how could they keep the pic from looping over again at a real high resolution like 1012x1220 or whatever?????? Thx to all that reply
I'm assuming that when you say 'frame' you're not referring to an HTML frame. If so then you can prevent the background from repeating either horizontally or vertically by inserting the following code in between the <head>...</head> tags of your web page:

<style type="text/css">
body {
background: url("path_to_your_background_pic") no-repeat #000000;

If you just want to repeat the background horizontally then replace 'no-repeat' with 'repeat-x'. To repeat vertically only, replace 'no-repeat' with 'repeat-y'. #000000 makes the rest of the background black. "path_to_your_background_pic" is hopefully self-explanatory.
I don't know if what he jost posted was it, but you COULD make a pic with a border to make it big enough for whatever resolution you stated, and then use the code that makes the words scroll instead of the whole page.
Littlegiant that is close to what I want. I am very interested in the no-repeat function. I don't want it to repeat horizontal or vertical. I can't seem to get that code to work. It just makes the background black and I don't see my pic. I am using Dreamweaver if that helps ya out. To the other guy I am interested in that code as well for the non scrolling picture. I seen a code like that once but heard it didn't work with netscape. Thx for the help both of yall
Oh btw it was a table I had made in the center of the page that housed the pic and the pic was the background for the table. The page underneath was just black. Sorry I should not have said frames I am still new to webbuilding and get confused

Sorry but I haven't got around to learning Dreamweaver yet and I'm sorry to say that it's not high on my list of priorities. However I'm sure a high-end WYSIWYG editor like this has a function that allows you to edit the HTML coding directly.

Basically, to apply the background image to your table you'll be doing the same thing except that you'll be applying inline CSS instead of embedded. (Don't worry if you don't know what that means.) Just insert the following code in the <table> start tag:

style="background: url('path_to_your_background_pic') no-repeat #000000;"

Two things:

1) Make sure the background pic you're using resides in the same directory as the web page that is loading it.

2) Unlike the code I previously gave you, the path_to_your_background_pic must be wrapped in single quotation marks (or no quotation marks at all).


If I remember correctly, if you're using a Mac, the path_to_your_background_pic should NOT use any quotation marks or it won't show up. (Somebody correct me if I'm wrong please.)
Well I finally had some success I used no repeat and background-position:center; But honestly the trick was u had to have that "images" folder. I dont see why that would matter but I couldn't get it to do anything untill I made it. When direct linking to a bg pic is usually fine it wont sem to work for css unless u make that folder. But you solved my problems littlegiant and I feel much more smarter with code now..Thx man
Great. Glad to be of service. BTW that "images" folder thing is definitely something to do with Dreamweaver. It most certainly has nothing to do with the CSS specification. Anyway, it's working now and so all's well.
Related topics
Google and Domains: help
Virus Problem
rollovers in CSS
[man]Servidor Web Personal (Tutorial)
[resolved] Background Problem
Is it a Virus?!?!
How to avoid people stealing your images?
Problem Help out
Transparent background image
phpBB - Installation Tutorial
problem z services.exe is now
Help needed from a volunteer WEB/player DEVELOPER/programmer
Reply to topic    Frihost Forum Index -> Webmaster and Internet -> Design Tips

© 2005-2011 Frihost, forums powered by phpBB.