Background images: how to fill whole div if image is small and vice versa

I have three problems:

1. When I tried to use a background image in a smaller size div, the div shows only part of image. How can I show the full or a specific part of image?

2. I have a smaller image and I want to use in a bigger div. But don't want to use repeat function.

3. Is there any way in CSS to manipulate the opacity of an image?

Resize the image to fit the div size.
With CSS3 you can do this:

/* with CSS 3 */
#yourdiv {  
    background: url('bgimage.jpg') no-repeat;
    background-size: 100%;
}

How Do you Stretch a Background Image in a Web Page:

About opacity

#yourdiv {
    opacity: 0.4;
    filter: alpha(opacity=40); /* For IE8 and earlier */
}

Or look at CSS Image Opacity / Transparency

To automatically enlarge the image and cover the entire div section without leaving any part of it unfilled, use:

background-size: cover;

This worked perfectly for me

background-repeat: no-repeat;
background-size: 100% 100%;

Try below code segment, I've tried it myself before :

#your-div {
	background: url("your-image-link") no-repeat;
	background-size: cover;
	background-clip: border-box;
}

Rather than giving background-size:100%;
We can give background-size:contain;
Check out this for different options avaliable: http://www.css3.info/preview/background-size/

This will work like a charm.

background-image:url("http://assets.toptal.io/uploads/blog/category/logo/4/php.png");
background-repeat: no-repeat;
background-size: contain;

1. I agree with yossi's example, stretch the image to fit the div but in a slightly different way (without background-image as this is a little inflexible in css 2.1). Show full image:

    <div id="yourdiv">
        <img id="theimage" src="image.jpg" alt="" />
    </div>
   
    #yourdiv img {
        width:100%;
      /*height will be automatic to remain aspect ratio*/
    }
   

2. Show part of the image using background-position:

    #yourdiv 
    {
        background-image: url(image.jpg);
        background-repeat: no-repeat;
        background-position: 10px 25px;
    }
   

3. Same as the first part of (1) the image will scale to the div so bigger or smaller will both work

4. Same as yossi's.