HTML - Two Backgrounds On A Page?
My main background for my website is a jpg image. Once it ends, it repeats itself; the problem with this, is that it interferes with some text I have on the page when the image repeats. Is there a way that I can have two backgrounds? After the first ends, I would like to put another background image for further down the page. So I am thinking something like this:
<body background = "image.jpg" > SITE STUFF GOES HERE </body> <body background = "image2.jpg"> MORE SITE STUFF </body> </html> But it's not working. Any ideas? THanks (I am super new to this, sorry if this is a stupid question) Similar Tutorialswhen i add more information to my background it gets lower... then if i move this info up the page the empty background space stays there how do i get rid of this empty space at the bottom of my page? ive tryeed using both html and css codes but the problem stays the same someone PLEASE HELP Hi, I was wondering if it is possible to have more than one background to a certain element in a page. ie. I have an element called main so within <div class="main"></div> Can i have two backgrounds, and can one of these only ever appear at the bottom as a sort of footer section? Thanks for any help, Hello first post, Somewhat a noob on this, but I have my pages background set to black. Now I have a header and one side bar. It was a up side down L but I cut the two up and put them in a three part table. Not sure if that is best. Now in the 3rd column is where I made a background that looks like paper. I can not figure how to set the background in this column. The reason I am doing this is cause some pages will have more text than the others, thus why I need a scrollable background. Hope that makes since and thx ahead of time. Plus, I am using Yahoo sitebuilder and pagebreeze, cause I am a noob and hate trying to place pictures via code . Hi y'all. Could anyone tell me if it's possible or, even better, supply the code for this. I want to create tables on a page with a semitransparent background so the underlying backgrounds shows through. To do this I've used the following code: <style> table, tr, td { background-color:transparent; border:none; border-width:0;} body { background-image:url('background_image_url'); background-attachment: fixed; background-position:center; background-repeat:no-repeat; border-color:000000; border-width:5px ; border-style: solid; } table table { border: 0px } table table table table{border:0px} table table table { border-style:solid; border-width:3px; border-color:000000; background-color:transparent; } table table table td { background-color: FFFFFF; filter:alpha(opacity=50); -moz-opacity:0.50; opacity:0.50; -khtml-opacity:0.50; } table table table table td {filter:none;} </style> My problem is that the text and images in the tables also go semitransparent. Is there anything I can add to the to make the text and images clearer against the table background? Alrighty, I've got div backgrounds that aren't showing up! Some are showing in ie but not in firefox, and some aren't showing anywhere. Here is a screenshot of what I'm experiencing (IE is on the left, firefox on the right) Also, the light blue background around the top nav. should be behind the page content as well (meaning the crappy "multi-monitor mounts" image and the crappier "featured products" text) any help would be appreciated! Thanks I'm going to be building a website, and instead of adding color to the background of the page, I'm going to add an image of a scene. How can I add it so that the image does not scroll but the content does. I've seen it done in the past. Thank you. How do I prevent the background of a table cell from repeating when the cell gets bigger? My handcoding is not that good and Dreamweaver doesn't seem to provide any code suggestions. Any help would be appreciated. Good day. I'm actually trying to make a good site now (still humorous), and am having problems with the background of my right collum. http://web.vtc.edu/users/cjb06271/CI...nal/order.html Quote: <form method="post" action="mailto:cjb06271@vtc.edu"> <table style="border:1px solid black"> <tr> <td><fieldset/>The always favorite Locusts. </td> <td colspan="1"><fieldset/> <input type="checkbox" value="Locusts" name="Locusts"/> </td> </tr> </form> same kind of thing happening on register page. you can see how I wanted it on any of the other pages. Also on the navbar you can see the right collum background image was chopped in half. Not too worries about that but if an easy fix would be apreciated http://web.vtc.edu/users/cjb06271/CI.../real%20final/ my css is in there (as are links to images and all the other sites in navbar) css name is new1. I may also be halucinating but the text seems to change fonts between pages and I don't know why. Thank you very much for any help you may offer. Hi everyone- I have a pretty simple question, I think. I made some banners for my site to add on put I'd prefer to have them stay on the top of the page even when you scroll down. Currently, I have them as a background that is fixed in one position but the only problem is that all of the rest of the page's content goes on top of the image. I would prefer not to use frames so I guess I am asking is there any other way to keep something at the top of the page and on top of everything else and/or is it possible to have you're background image remain on top of the rest of the page's content? Thanks for your time- I've moved away from the difficult Liquid background and have came up with a more simpler solution...yet i still need help here, amazing isnt it? So heres what im trying to do; notice the word "trying". I have a plain background colour ( a dark green ), I then added a layer containing a image of parchment to set the background for text, which i then centered on the page so this fixes the problem of people with different screen resolutions. I now want to add text, so i made another layer, typed the text for the welcome page, and clicked centre....uh ohhh, guess what? It didnt work! I then tried copying codes from the first table i centered, but it simply refuses to hate me and doesnt work. If you cant visulise what im trying to get i drew a pretty picutre for you; Link shown below. http://s195.photobucket.com/albums/z...nt=Website.jpg So heres the big question. How do i set the writing to be centered on the page ( not centered text, the text is left alligned but i need it to apear in the centre of the page), and a certain amount of pixles from the top so as it will always fit on the background parchment layer wihtout moving about all over the place? Many Thanks, Nathan For some reason the text and links on the following page are not working... as in you can't click on them. At first they wouldn't show over the background, and now they do but they don't function. Why? How do I fix that? Also, how do I get the iframe background to be transparent against that image so it all flows together and do I need to do anything to ensure that the iframe comes up? Why doesn't it show? HTML Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>Fresh Sessions</title> <link rel="stylesheet" type="text/css" href="style.css" /> <style type="text/css"> html, body { height: 100%; margin: 0; padding: 0; } #bg img{ position:fixed; top:0; left:0; width:100%; height:100%; } } #content { position:relative; z-index:1; } </style> <!--[if IE 6]> <style type="text/css"> html { overflow-y: hidden; } body { overflow-y: auto; } #bg { position:absolute; z-index:-1; } #content { position:static; } </style> <![endif]--> </head> <body style="overflow: hidden"> <div id="bg"><img src="skates/shred.jpg" width="100%" height="100%" style="opacity:0.4;filter:alpha(opacity=40)"></div> <div id="content"> <center><h1>FRESH SESSIONS</h1> <br><a href="about.html" target="steezbox">About</a> <a href="" target="steezbox">Max & Mike</a> <a href="" target="steezbox">Pricing</a> <a href="" target="steezbox">Safety</a> <a href="" target="steezbox">Links</a> </center> </div> <iframe src="about.html" name="steezbox" align="middle" width="400" height="100%" scrolling=no frameborder=0> <p>Your browser does not support iframes.</p> </iframe> </body> </html> Hi. I'm a FP/html/website builder noob. Is there a way to change all fonts/all backgrounds in FP2003/with html? e.g. Is there an easy way to change all fonts in headers, text areas, tables etc from one font to another. Thanks. Hi, I can make basic websites but I am not very skilled in web design. I am in need of help. Since I made the website inside Photoshop using slices, I need to create a table at the center of the website. Since the center of the website is made of slices of jpeg images, I cannot create a table nor add any text here without disturbing the images. I can get around this by making the pictures part of the cell background, but when I try and remove the images in the center after, the cell background images repeat over and over, and the whole website is unaligned and a big mess! Below is a picture of what I mean... I have included a zip file containing my html pages and image folder. Please download it he http://homepage.ntlworld.com/stephan.../Portfolio.zip The file I need help with is work.html. I can ensure you it's virus free. I want to show my photoshop work off on a website, this is the reason why I am making this website. Hi, Background: I have a small page that need to be embeded into a bounch of other html pages. Help needed: 1. Please provide the html chunk that I can use to embed the small page in to other html pages. 2. Is there a way of not using iframe? Can I use <Object> or <embed>? How? --------------------------- mba colleges in london hospitality management diploma Some mouses today have horizontal scroll, some call the tilt. It looks something like: http://www.htmlforums.com/attachment...1&d=1242556560 I noticed that many websites they code those horizontal scroll to go to next/prevous page. For example Discuz! forum system has this function. While you browse hundreds or thousands of posts separated into pages, the horizontal scroll can take you to previous page or next page.(not browser back/forward) How do I code like that? Or any examples? Below are the two sites I will use to explain my problem. For reference, I used Mozilla Firefox 3.08 and Google Chrome 1.0.154.53 in my tests. Example 1: http://www.irishbyname.com/example1.htm Example 2: http://www.irishbyname.com/example2.htm When browsing the site in a browser other than Internet Explorer, example 1 and example 2 center to different locations on the page. In example 1, I set the height of the content area to be 200 px tall. In example 2, I set the height of the content area to be 500 px tall. When I have example 1 open in one tab and example 2 open in another, I can alternate between the two tabs and see a visual difference in alignment. The HTML code on both pages is exactly identical with the exception of the height of the content area. Can anyone tell me why the horizontal page center changes based on the height of the page? Can anyone tell me how to change my HTML to make certain the page centers correctly no matter how tall the page is? Thanks for your help in advance. I believe in thread titles that get to the point. I have a basic page, when the page loads I want people to see the top of the page for a few seconds while a flash starts to load but then I want the page to scroll down a bit so the visitor can see the flash load progress status. I just want code that I can copy into my page. I don't have access to the flash code. Greg (the page under design) www.mytcanada.com/designer.html I have a programmer in the US who starts pages for me and then I much around with them until it's looks like I want. He helps me when I get stuck but he's on holidays. Any help would be great. I have plain HTML on the main page and <iFrame> tag on it, inside tag i have URL to other page that using some script that forces host page to reload and show page from frame instead of it. Can i somehow stop it from messing my entire main page? Hello; I have text box & submit button in page_1 & I have text box & submit button in page_2. I want when write text in text box in page_1 it go directly to text box in page_2 & I want when click on submit button in page_1 it is like click on submit button in page_2. Assume page_2 located in other site www.page_2.com. How to do that.?? |