Help With Background Image - please? :)

free web hosting
Open Discussion > CONTRIBUTE > Computers > Programming Languages > HTML, XML etc..

Help With Background Image - please? :)

~Dave
Ok heres the scoop, i got a background that i made in paint for my website its just like 3 lines for the nav bar, banner and other things ect. ect. now when i hosted it on a site and put in the <img src= code with the URL of that picture it shows up and everything but its tiled and shows 4 of them...

This is what it looks like in paint
http://img.photobucket.com/albums/v614/Dj1.../background.jpg
and this is what it looks like when i put it into HTML
http://img.photobucket.com/albums/v614/Dj169211/Damn.jpg

i dont want it tiled like that so is there any way that i can change that?

any ideas? :| Thanks in advance smile.gif

Reply

matak
Well this is not using your image, but achieving similar thing with simple use of CSS like this

HTML
<style>
div {
background: #000000;
color: #FFFFFF;
border-left: 4px solid blue;
border-bottom: 4px solid blue;
width: 600px;
height: 120px;
}
</style>
<div>
Your div
</div>


You can see result here

EDIT:
Oh and you problem is in that you have to set background to no-repeat with CSS like this

CODE
body {
background: url(yourimage.jpg) no-repeat;
}

Reply

delivi
if you want a background for your page, you should'nt use <IMG> tag, use the following css code

include the code in between the <HEAD> </HEAD>

CODE
<style type="text/css">
body { background-image:url("URL_OF_IMAGE"); background: no-repeat;}</style>


replace URL_OF_IMAGE with the image url that you want to be your background

Reply

~Dave
ok, i tried both and all i got was a blank page. What am i doing wrong? i name the file Index.html

here is what it is so far...


CODE
<html>
<title>
*my title*
</title>
<body>
<style type="text/css">
body { background-image:url("http://img.photobucket.com/albums/v614/Dj169211/background.jpg"); background: no-repeat;}</style>
</html>
</body>



i know that is not a full html text file but i'm just testing the back ground img.

Notice from truefusion:
Place all code into the CODE bbcode.

Reply

saga
QUOTE(~Dave @ Feb 20 2007, 03:34 AM) *
ok, i tried both and all i got was a blank page. What am i doing wrong? i name the file Index.html

here is what it is so far...
<html>
<title>
*my title*
</title>
<body>
<style type="text/css">
body { background-image:url("http://img.photobucket.com/albums/v614/Dj169211/background.jpg"); background: no-repeat;}</style>
</html>
</body>
i know that is not a full html text file but i'm just testing the back ground img.


the marked red should be

CODE
body { background-image:url("http://img.photobucket.com/albums/v614/Dj169211/background.jpg"); background-repeat: no-repeat}

 

 

 


Reply

jlhaslip
A similar question at another Forum I attend to has a thread about this and one recommendation is to use 4 div's, which makes sense and would probably be easier. CSS only with borders.
Have look here: http://codingforums.com/showthread.php?t=107915

Reply

hitmanblood
You probably have problem with the size of your image as it is too small to fit as background it just tiles up. That's why you gt such effect maybe using table and cells would be better you can make it look just like your image.

Reply



Got an Opinion! Express your Views! (no registration):-
Add your Reply/ Opinion/ Views/ Comments/ Suggestion/ Questions/ Queries etc.
Posts with decent grammar & English will be accepted and please refrain from profanities.
For asking a Question, We recommend you to sign-up (for free) so that you can track the topic easily.

Nature of your Post*: Opinion/ Reply/ Comments
Question/Query
Feedback to us.
       
Name   Email
Title/Question*

(Maximum characters: 10,000)
You have characters left.

Similar Topics

Keywords : background image

  1. Fixed Background Image - Just little reminder (10)
    Easy teahnic, post the following codes between and QUOTE <!--
    body{background-image: url( under.gif ); background-repeat:no-repeat; background-attachment :
    fixed; background-position: 10% 20% ;} --> For red colour, change it to your
    image's location. For green colour, it is used to set horizontal and vertical position of
    background image. I hope it can help you. /tongue.gif' border='0' style='vertical-align:middle'
    alt='tongue.gif' /> ...
  2. Ok Background Help Please - html (4)
    OK so i've given up on the paint for background now how would i get it to look like this
    http://img.photobucket.com/albums/v614/Dj1.../background.jpg without using paint and without it
    coming out to look like this... http://img.photobucket.com/albums/v614/Dj169211/Damn.jpg like,
    with just html code, not trying to use paint and do the BS any ideas?...
  3. Background Question - :) (12)
  4. Background Image Picture On A Website - how do u make a pic a backround?? (3)
    ?email me if u know! Trap17 forum asks you to post contributes with substance. ...
  5. Image Links - (5)
    Ok...another question...may sound stupid, but we're all stupid...how'd I be able to create
    an image link. Uh...let me rephrase this: If I were to create an "Enter" image and wanted people to
    click the image to enter to a certain page, how would I do it without some sort of the famous "Blue
    Line" around it? Any help would be greatly appreciated... /unsure.gif"
    style="vertical-align:middle" emoid=":unsure:" border="0" alt="unsure.gif" />...
  6. Typing Over Image - (7)
    Is it possible to have a linked font over an image (not being a background image)? If so, how do I
    accomplish that?...
  7. Getting An Image To Scroll On With Content - (13)
    ok, well i had had people review Hogwartsmagic.net and they said that i should get it to not be one
    huge image as a layout..and i have figured most of it out and it has proven sucessful! but now i
    am having diffuclty, i am pretty much only a basicl HTML kinda person... and i was wondering if
    anyone knows an html code that will allow one image to scroll the entire length of a pages content?
    for example, if i were to add 200 links to the right navigation..the image would go with the
    content.. i am testing it out here HERE any help would be much appreciated...
  8. Image Roll Over Drop Down Menu Help - (2)
    Ok I been searching for days now on a half way descent tutorial on how to do a Image Roll Over Drop
    Down Menu in CSS without the use of javascript, I been seeing alot of the suckerfish set up but of
    course no one goes in to detail on how to set up the image rollover version of it. Plus I don't
    want the dhtml or the javascript setup just good ole pure css. Also I need ot be able to control
    multiple menus in one script as well. CODE <!DOCTYPE html PUBLIC "-//W3C//DTD
    XHTML 1.0 Strict//EN"    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict...
  9. Need Help With Image Wrapping - (13)
    ok my problem now is that i need it to auto width the image that needs to be use so then I can use
    tags for the content without the need for the image to expand from left to right. heres the css for
    the image wrap CODE <style type="text/css"> span {     background-image:
    url(images/gfxtrap_42.gif);     background-repeat: repeat-y;
        background-position: top left, bottom right;     height: 200px;     border: 0px; }
    </style> heres the rest of the website code. CODE <!DOCTYPE html PUBLIC
    "...
  10. Ie5 Mac Does Not See My Site - It shows the body bg image only... (11)
    Remember that site layout I was hacking down for IE? Which by the way I didnt really like, but it
    was the customer's design... and yes, he is not a graphic designer hehe... Anyway I was really
    surprised that I got to the solution and fixed it... but as I'm testing between browsers, I come
    to see that Internet Explorer in Mac does not show nothing of my page, yet the source code is there,
    if you click command + e in order to see the html source code, its all there! But all I can see
    from the page itself is the body background-image... I tried removing the d...
  11. Usemap And Table Background Image Changing - (5)
    I have a menu page that consists of links to other pages. The page has a background image of a
    globe. The globe is divided into seperate sections for each menu item. As a user hovers over each
    section I change the background image(The same globe with that section highlighted.) That is what I
    have so far except that they have to hover over a small anchor tag that I put in not the whole
    section. I want to change it so that they can actually hover over all of the section they are
    selecting. I found usemap online but haven't found any examples where it will actually ch...
  12. Image Doesn't Load - (6)
    Hi, Never hapened to me since HTML was invented. I've got a webpage ( h.shtml - I've also
    tryed .htm, .html ) with the following code: Code: CODE <html> <head>
    <meta name="GENERATOR" content="Microsoft FrontPage 5.0"> <meta
    name="ProgId" content="FrontPage.Editor.Document"> <meta
    http-equiv="Content-Type" content="text/html; charset=windows-1252">
    <title>Horoscope</title> </head> <body> <div
    align="center">  <cente...
  13. Image.index.html - (10)
    hello there well i designed this image that includes text a logo i shall say i am aware that i need
    to title it index.html when i upload the file i visit my website and it shows the file folder. now i
    only want that image i designed on there so when clients visit my site it only goes to that page the
    rest of my site isent done yet. i want it to be just like the sites you visit and it states
    underconstruction. programs ive tried: indesign, image ready, incopy cs2, dreamweaver. and i
    still dont understand please help meeh thanks oh and what classify's images html,...
  14. Background Resize - (4)
    Does anyone have the javascript for a background to resize? I want my background to resize to
    1024x768 if the visitor has resolution 1024x768, to 800x600 if the resolution is 800x600 etc.
    Greets, ExplosioN /smile.gif' border='0' style='vertical-align:middle' alt='smile.gif' /> ...
  15. Substitute Form Button For An Image - homemade images in forms buttons (3)
    Hi, I have the next formular : CODE  <form method='post'
    action='index.php?mode=2&id=1'>                <input type='hidden'
    name='name' value='Canon Digital Ixus 700'/>                <input
    type='hidden' name='id' value='1'/>                <input
    type='hidden' name='qty' value='1'>                <input
    type='hidden' name='cost' value='40'>                <input
    type='submit' value='Add to ca...
  16. Background Fit Any Resolution - hmmm (6)
    Is it possible to do with html. I have found a few solutions but they dont seem to work. I know it
    is possible in java. But anyone have the code for html? Would really appreciate it....
  17. Background Not Big Enough - (4)
    Hi: Ok, first off....moderaters, please move this topic to the appropriate category. I really
    couldn't find a spot to put this in...so I just picked one. Here is the page I have a question
    about: http://histology-world.com/articles/article9.htm The problem? Scroll down and you can
    see. My background image is not long enough. I have gone into my photo editor and readjusted it,
    just made the canvas size larger. But then I am starting to get concerned about file size. I want
    the lights at the top. When the background image repeats itself, the lights are ins...
  18. Simple Smil Question About Image Positioning - (3)
    Howdy all, I'm working on a project for college but ran into a "little" problem with SMIL,
    concerning positioning images. You can see the smil presentation here:
    http://www.ket.trap17.com/smil-show/index.html (its only a 15 second presentation and doesn't
    take long to load. don't mind the language on the left image, its portuguese) What i want to
    do, is to make the image on the right, to fade in in the same place as the left image. I tried
    setting a region but that didn't work, I tried using the layout tags in the but that also
    didn't work (o...



Looking for background, image,

*RANDOM STUFF*





*SIMILAR VIDEOS*
Searching Video's for background, image,

*MORE FROM TRAP17.COM*
advertisement



Help With Background Image - please? :)



 

 

 

 

ADD REPLY / Got an Opinion! a humble request :-) RAPID SEARCH! Free Hosting [X]
Express your Opinions, Thoughts or Contribute your information that might help someone here.
Ask your Doubts & Queries to get answers.. "Together, We enlight each other!"
Register FREE for AD-FREE forum, Create your own topics, Ask Questions, track topics, setup subscriptions & notifications and Get a Free Website w/ Email and FTP.
500MB Space *No Ads*, CPanel, FTP, PHP, MySQL, EMails - 100% FREE