CSS怎么样让背景图片水平（垂直）居中

2024-12-21 15:25:53

推荐回答（5个）

回答1：

CSS中定位背景图片的属性是：background-position，用法background-position 属性设置背景图像的起始位置。
你要水平居中可以：
div{background-position:center center}//第一个center是水平居中，第二个center是上下居中

CSS（层叠样式表）级联样式表是一种用来表现HTML（标准通用标记语言的一个应用）或XML（标准通用标记语言的一个子集）等文件样式的计算机语言。

回答2：

1.使用css的background-position属性设置背景的位置，下面是demo实例



	
		
		
	
	
		针对当前div层背景居中

		ps:背景图片是需要高度和内容撑开的。没有高度没有内容，背景图片是无法显示的

.bgImg{
background: url(images/2.png) center no-repeat; /* 这个是简写,可以分开写 */
/* background-position: center center; */
/* background-image: url(images/2.png); */
/* background-repeat: no-repeat; */
width: 200px;
height: 200px;
border: 1px solid #000000;
}
.bodybg{

background: url(images/2-1.png) center no-repeat;
height: 100vh; /* 一屏高度的表示*/
}

回答3：

:no-repeat为背景图不重复，最好是满足1280宽度的分辨率下位满屏，图片可以宽度为1280像素，第一个center为水平居中，第二个center为垂直居中，第二个center换成top也就是顶部显示背景图。

回答4：

ps？cs？css？
移动工具的选项栏有居中按钮，要两个图层选择才能启用。

回答5：

background: url(../images/1.png) no-repeat center center;
background-size: contain;