Background image control problem in DIV, thank you_html/css

Background image control problem in DIV, thank you_html/css_WEB-ITnose

WBOY

Release： 2016-06-24 12:22:12

Original

950 people have browsed it

My DIV is displayed in the center. I want the background image in the DIV to be the same width and height as the DIV. How to achieve this? The width of the current image has exceeded the width of the DIV. Thank you

.middleimg{	margin:0 auto;	width:500px;	height:200px;	border: 1px solid #eee;	background-repeat:no-repeat;	background-image:url(image/login/loginpic.png);	}

Copy after login

> The width of the image has exceeded the width of the DIV, then set the width of the image
document.getelementById ("#id").style.width

Assign the width of the div to the width of the image

The width of the image has exceeded the width of the DIV, then set the width of the image

document.getelementById ("#id").style.width

Assign the width of the div to the width of the image

Can you tell me how to set the width of the image? I did not use the img tag

The width of the image has exceeded the width of the DIV, then set the image The width

document.getelementById("#id").style.width

Assign the width of the div to the width of the image

<!doctype html><html><head><meta charset="utf-8" /><style>*{	margin:0;	padding:0;}#middleimg{	margin:0 auto;    width:500px;    height:200px;    border: 1px solid #eee;	postion:relative;}#bg{	width:500px;	height:200px;	position:absolute;	z-index:-1;}</style></head><body><div id="middleimg">	<img id="bg" src="image/wallpaper-1542283.jpg" />	哇咔咔咔我是一个登录框！</div></body></html>

Copy after login

Can you tell me how to set the width of the image? I have no use. The width and height of the img tag

should not be set for the background image, and setting the xy coordinates should not be your original intention.
Just use img positioning combined with z-index to simulate a background image with the same size as the div.

Only applicable to IE,

If the author wants to be compatible with other browsers, just use two layers.

.middleimg{     margin:0 auto;    width:500px;     height:200px;     border: 1px solid #eee;       background-repeat:no-repeat;      filter:progid:dximagetransform.microsoft.alphaimageloader(src='image/login/loginpic.png',sizingmethod='scale')     }

Copy after login

1. There are many ways to create a background, such as z-index