How To Add A Repeat Background On A Website Dreamweaver

Find or create a suitable repeating background image, a useful site is
http://world wide web.allfreebackgrounds.com
Open our Bird Bathroom website.
Change > Page Properties.
From the Appearance CSS sections cull browse and discover the image yous want to use as a repeating prototype. Due east.chiliad. birdbath4-groundwork-echo.jpg
Choose Repeat from the Echo menu.
Choose Ok

Background image that doesn't move.

This play tricks with make any background image remain stock-still while you scroll the website.

Note: Your website must be alpine enough to curlicue.

Add a background epitome as shown in a previous exercise.
Cull 'body' from the Selectors console
Change 'background-attachment' to fixed.
Change 'background-position' to 50%.
Change 'background-repeat' to none.
Preview your document
Note: When you lot coil up and downwardly the background shouldn't motility.

Background at 100%

This technique will allow you to add a background paradigm to your piece of work that is stretched to cover the unabridged browser. Information technology is supported by all new browsers. Some older browsers (like IE viii) demand all fiddling bit of actress code to brand it piece of work.

Notation: This exercise is all-time added at the kickoff of a website build. It can be added to an existing site but there can be a few layout problems y'all'll have to adjust to make it work. In my feel I've found that it causes less problems adding this CSS to each page rather than the external CSS sheet.

Annotation: You'll need a large image. Current full screen prototype size standard is 1600x1200. Yous can apply something similar Photoshop to create the right size.

Open: Dreamweaver Exercise Files > Text > Background CSS Code.docx
Select all the code and copy it.
In Dreamweaver cull Code View
Put a couple of returns just above the tag:
Paste in our background code.
Change the x3 file names to the proper noun of our background prototype.
e.thou. background-total.jpg

Note: In design view yous will not come across the background. You lot'll have to preview the document to see the results.
File > Preview in browser > Chrome
Washed.

Background inside divs

A div tag is able to have its own background image. This will let you lot put an paradigm into a box and let you to put text of the acme.

Choose the div in your selector console. Nosotros'll use #text for this exercise.
Note: In this tutorial we're making the div 549px ten 350px to match the epitome.
Discover the groundwork-prototype in the properties panel.
Next to url choose browse.
Find the epitome Dreamweaver Exercise Files > Sample Images > background-div.jpg

Note: Your image should either exist the exact size of the div or your paradigm needs to be able to be repeated. A repeatable image is good equally the div tin can expand and contract and the image will fill the space. To repeat your groundwork image you lot employ the 'groundwork-repeat' function.