How can i insert a background image in a fluide grid DW CC

I want a background image for a fluid grill website and cannot seem to find the "how to". Any help would be greatly appreciated.
Regards
Animal86

It's the same as adding a background to any Layout. Use CSS & the background property on your body selector.
body {
background: url(your_BG.jpg)
Nancy O.

Similar Messages

How can I stretch a background image in label?

Hi,All
How can I stretch a background image in a label?
public void start(final Stage primaryStage) {
             final Label lbTest = new Label("My Test Label");
             lbTest.setAlignment(Pos.CENTER);
             lbTest.setTextAlignment(TextAlignment.CENTER);
             lbTest.setStyle("-fx-background-color:red;-fx-background-repeat:stretch;-fx-background-position:center top;-fx-background-image:url(\"http://upload.wikimedia.org/wikipedia/commons/thumb/1/1c/BlueMarble-2001-2002.jpg/640px-BlueMarble-2001-2002.jpg\");");
             final HBox hbox = new HBox();
             hbox.setId("MyRootPane");
             Button btnLeft=new Button("Left Button");
             Button btnRight=new Button("Right Button");
             hbox.getChildren().addAll(btnLeft,lbTest,btnRight);
             final StackPane layout = new StackPane();
             layout.getChildren().add(hbox);
             Scene scene = new Scene(layout, 600, 320);
             lbTest.prefWidthProperty().bind(scene.widthProperty());
             lbTest.prefHeightProperty().bind(scene.heightProperty());
             primaryStage.setScene(scene);
             primaryStage.show();
    }this code doesn't work,if I deleted css -fx-background-repeat:stretch;the background image stretched but repeated,I want to let the background image stretched and no-repeated,it can be stretched with the resizing window automatically.

Try -fx-background-size: stretch;

Dreamweaver: can i insert a background image in a layout table?

i'm using a layout table and i can't figure out how to put a
non-repeating image into the background of my layout table. is this
possible? i need to center it too.

Before anything else, I would say DON'T USE LAYOUT MODE.
In my opinion, there are three serious problems with Layout
Mode -
1. Perhaps most importantly, it sits between you and *real*
HTML tables,
and fools you into believing that concepts like "layout cell"
and
"autostretch" really mean something. They do not. As long as
you use
Layout Mode, you'll never learn one of the most important
things for new web
developers - how to build solid and reliable tables.
2. Actually, #1 wouldn't be *so* bad, except that the code
that is written
by Layout Mode is really poor code. For example, a layout
table contains
MANY empty rows of cells. This can contribute to a table's
instability.
In addition, if your initial positioning of the table's cells
is a bit
complex,
Layout Mode will throw in col- and rowspans aplenty as it
merges and splits
cells willy-nillly to achieve the pixel-perfect layout you
have specified.
Again,
this is an extremely poor method for building stable tables,
because it
allows
changes in one tiny cell's shape (i.e, dimensions) to ripple
through the
rest
of the table, usually with unexpected and sometimes
disastrous consequences.
This is one of the primary reasons for the final result's
fragility - read
this -
http://apptools.com/rants/spans.php
3. The UI for Layout Mode is beyond confusing - many options
that you might
want to use are inaccessible, e.g., inserting another table,
or layer onto
the page.
I can understand the new user's desire to use this tool to
make their life
easier,
but the cost is just too heavy in my opinion.
To make good tables, keep it simple. Put a table on the page,
and begin to
load your content. If you would want a different table
layout, instead of
merging or splitting cells, consider stacking tables or
nesting simple
tables instead, respectively.
And above all, do not try to build the whole page with a
single table!
Luckily, Adobe understands the problems created for the
unsuspecting user
who falls into this trap, and has elected to remove this
feature altogether
from the next version of DW. The time is right for you to
begin working
with tables properly!
To read more about this approach, visit the DW FAQ link in my
sig, and run
through the table tutorials.
Adobe agrees with this analysis - Layout mode is being
removed from the next
version of DW.
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
==================
"dfgsdrsdr" <[email protected]> wrote in
message
news:[email protected]...
> i'm using a layout table and i can't figure out how to
put a non-repeating
> image into the background of my layout table. is this
possible? i need to
> center it too.

How can I get the background image of my website to cycle on a timer?

I'm afraid my experience with Javascript (Which I'm certain this will require) is fairly limited and I'm still quite new to Dreamweaver, so I'm posing this question to you guys.
I'd like the background image of my website to change every five minutes or so, however I'm unsure of how to accomplish this. For those of you with Windows 7, you can set the background of your desktop to cycle through a folder of images every ten minutes or so. I'd like something similar for this website.
Thanks in advance.

Supersized can do this for you with very less need for code.
http://www.buildinternet.com/project/supersized/ - Take a look at their demo. It's also a lightweight plug-in and it has a lot of great effects you could use. Also x-browser friendly.

How can I do a Background image like this (example inside)

Check this out:
Click Here
Notice if you view the background image by itself, its much bigger than what is appearing on the website in the browser. Is it set to automatically adjust to your monitor size? How can I achieve this through CSS?
Also, how can I setup a transparent background (like in the middle of the page?)
Thanks

"Is it set to automatically adjust to your monitor size? How can I achieve this through CSS?"
It's an illusion. The body background image is defined with a fixed position, so the image is actually floating off to the left when viewport width is decreased. Another example of this can be seen here along with the CSS code used to create it.
http://alt-web.com/DEMOS/fixed-background.shtml.
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
www.alt-web.com/
HTML Validator - http://validator.w3.org
CSS Validator - http://jigsaw.w3.org/css-validator/
Tutorials - http://w3schools.com/

How can I have a background image for reference ?

HI,
I need to register align horizontally and vertically) about 100 images to the first. I don't want to stack or merge them. An ideal way to accomplish this would be to be able to set the first image as a background reference image for all images in the group. There would be left/right buttons so I could advance through the stack, a slider to adjust the visibility of the foreground image, and up/down & right/left arrows so I could move the upper image a pixel at a time in any direction. In this case I don't need to rotate the image, but this would also be something a person might want to control. Then I would move through the group of images, stopping on each one to align the image to the first. One at a time, or after I am done, it would save all the aligned images to a new filename and folder, without changing the transparency of the image or in any way using the background reference image. Without rotating the images, every pixel in the new image would be the same as in the original, except moved. I would start by resizing the canvas of all the images so they have a border area. This way I can move the image around and not lose any of it.
Of course I could put the reference image in the background layer and the image to be adjusted above it on another layer. Then i can use the background as a reference by making the upper image somewhat transparent. Finially I could delete the background layer and save the image with just the adjusted layer. But this would be tedius with 100 images, even worse if there were 1000..
Is there a reference background image capability in Photoshop CC ? Is there a better or different way to do this ? Or can Bridge do it ?

When I first posted this I had selected Photoshop as the community. After it had posted I saw it had changed and again changed it back to Photoshop. it again reset it to Premier Pro. I don't know why. Also, I had selected Refrence image as a tag and that keeps dissappearing. Even worse, there are no replies. What's the deal ?

How can I put a background image in headers in PAGES

It seems I cannot put a background image in headers. I want a background gradient to go behind the text. I have to place it on the "page" "behind" the header on every sheet instead. Other than creating a graphic that is both (bitmapped) text and image, what can I do? Or is there some way to create an object that has edittable text over the image. Thanks, Peter

If you are referring to Pages app, it is easy:
Open your document
Go to Menu >> View >> Show Layout
You will see headers, body and footers laid out with edges
Click inside the header
Open your Media browser
Drag your graphics (or photo) into the header
Be sure to PRESS AND HOLD COMMAND (APPLE) KEY while you do this!!!
If you don't pres the key, the picture will be pasted outside the header!
I think the Command key press was what was screwing you up here...
This applies to Numbers and iWeb as well, BTW

How can you make a background image change to a faded state at a certain point in scroll?

I'm referring to a technique I've seen used in Relevant Magazine's iPad app if anyone has used it. I understand having a shape behind text that has a feathered gradient and when you scroll the text the shape gradually fades out the background image. But this is not the effect I'm trying to acheive. On some of the articles in Relevant, the screen is a full image and as you scroll the type up, the entire background dims when you scroll to a certain spot.
I've tried searching for hours, but I feel like I'm getting no where because I don't really know what to search for. I feel like it requires use of something other than what DPS is capable of. Hopefully this makes sense and I'd greatly appreciate any suggestions and help!
Thanks!

Try applying the feathered gradient to the scrollable content frame, not the background frame. It will appear to change the color of the background frame.

Making my header background image scaleable using fluid grid layout

I'm sorry I dont really know how to post a link to this site (its not online just on my laptop) But really all I have is a blank screen I just started trying to build this responsive site (the site I was building wasn't responsive so i had to start over so thats where I'm at. I started a new fluid grid layout in dreamweaver cc I use 24 collums at 100%. I deleted the the div (but not the grid container one) . First is that I'm trying to build a header using the fluid grid layout (my laptop screen is 1920 px wide so I use the full screen because I want my site to take up a users full screen). The issue is when I use a image thats 1920 px width for a header background it test great in the browers meaning it scales correct but when I check it out in the smartphone and tablet preview options within dreamweaver cc the image is chop off. How do I get the image and really the rest of the site to scale and resize correctly not just in full screen for my pc but for tablets smartphones and anyones computer? I'm baffled please help? I hope I'm being clear if not I'll try again I need your help thank you

Try to keep responses in the original thread, it keeps replies from getting confused.
http://forums.adobe.com/thread/1430668?tstart=0

How can I insert a background into a photo?

I have several still photos I have taken with a green screen backdrop. I would now like to cut the image and install a background for these shots. I have imported the pics into iphoto, and now am stalled out as to what program or technology to use. Any advice would be appreciated!

You'll need a 3rd party editor that can handle layers:
Some Image Editors That Support layers:
Photoshop Elements 11 for Mac - $79
Rainbow Painter - $30
Imagerie - $38
Acorn - $50
Pixelmator - $60
Seashore - Free
GIMP for Mac - Free
Xee 2.1 - free
The following was done with Photoshop Elements (without a green screen):
OT

How Can Make a Large Background Image For A Website (reduced file size)?

Hi, I want to edit a large photo so that it fits the width of the browser (I'm using a responsive layout). The image needs to be a small file size so that it loads quick enough.... My question is are their any tricks or adjustments within Photoshop where I can reduce the file size of an image whilst maintaing large image size. I heard that adding noise can reduce the file size or something? Is there any other effects that do this?
Thanks in advance!!!

twenty_one wrote:
JJMack wrote:
If I were stuck in an area that only had low speed Internet connections I would not use the web as much as I do.
Where do you get this stuff...? About the only thing I do strictly for fun on the internet is this and a couple of other forums. Other than that it's strictly business and I really don't have a choice in the matter. So there I sit, patiently waiting, counting 0, 1, 1, 0, 0, 1, 1, 1....
You making my point if all you have is slow Internet connection you use the web less. You only use it when you have a real need. You do not use it for fun or streaming video you live with the reality of what you have and use it accordingly.
In 2003 I took a long vacation to New Zealand and Oz land. I carried my ThinkPad with its 15" IPS 1600x1200 px Display for Photoshop and storing my images. I also use for connecting to the Internet via modem for E-mail and banking not for fun. These days you can carry a iPod in you shirt pocket and gab a cup of coffee at a local Starbucks a use a high speed wireless in access point they provide for their customers for free. High speed in becomming the norm in all but rual areas.

How can I insert a single image that resizes to full screen when I pinch it out?

Hey there. I'm looking for a feature (similar to the gallery widget) where I can have 1 small image and when you tap or spread your fingers, it resizes to full screen. Is this possible?

Thanks, Caleb, that worked!
But I have a follow up question. So if I use Edit Mask so that I can only see a portion of the image, when I tap the image, I only enlarge the visible portion. In fact, it isn't even enlarged: I only see the same portion of the image at the same size. This is not the behaviour you get with the gallery widget. Is that also your experience, or am I missing something?
In thinking about it, I can probably make do with the gallery widget in the cases where I would like this behaviour, but it seems like this should work.

How can I put a background image into the cell of a table using Dreamweaver CC.

I want to place an image in a table cell and then be able to place editable HTML in the same cell on top of image. I also have Dreamweaver CS6. I can't get either one to do it using solution I found searching on web. Please help ASAP. What am I doing wrong. Example code would be great. Thanks!

No tables required for any of this. You simply need a 3-column starter page.
In DW, go to File > New > Blank page > HTML.
Select a 3-column layout from the 3rd panel.
Hit Create button.
Learn to use CSS floats, margins and padding to align elements. DO NOT use positioning.
Start with & bookmark these links for future reference:
CSS Box Model
http://css-tricks.com/all-about-floats/
CSS Float
Floatutorial: Step by step CSS float tutorial
CSS Margin
CSS Padding
Nancy O.

How to insert a background image in VGroup in Flex Mobile

I want to insert a background image for this VGroup. Help me out. I'm new to Flex !!
I'm using this code in Flex Mobile Application
<s:VGroup height="100%" width="100%"
          paddingTop="10" paddingBottom="10" paddingLeft="10" paddingRight="10">
    <s:List id="homeList" height="100%"
            labelField="title"
            dataProvider="{homeNews}">
        <s:layout>
            <s:TileLayout requestedColumnCount="1"
                          verticalGap="5"/>
        </s:layout>
        <s:itemRenderer>
            <fx:Component>
                <s:ItemRenderer>
                    <s:VGroup>
                        <s:BitmapImage source="{data.source}"/>
                        <s:Label text="{data.title}" />
                    </s:VGroup>
                </s:ItemRenderer>
            </fx:Component>
        </s:itemRenderer>
    </s:List>
</s:VGroup>

I don't think you can add a background image to a VGroup directly, nor can VGroup be skinned.
As far as I am aware there are probably 2 solutions
1) use a SkinnableContainer instead skin the container to have a background image and set its layout to VerticalLayout
2) enclose the VGroup in a Group with a BasicLayout. you can then add a background image to the Group and overlay the VGroup

How can I use a vector image to stretch with the backgrounds in Muse master pages?

How can I use a vector image to stretch with the backgrounds in Muse master pages?

Maybe there's a bug. I think it's only showing it when it wants to because look:

How can i insert a background image in a fluide grid DW CC

Similar Messages

Maybe you are looking for