如何设置div背景图片居中(div怎么设置图片居中)

如何设置div背景图片居中,div怎么设置图片居中

内容导航：

divcss 如何让背景图片居中

在网页设计中怎么让背景图片水平居中

div布局网页时如何设置ul，li横向导航水平居中

divcss，图片怎么设置在DIV中垂直居中

一、divcss 如何让背景图片居中

DIV+CSS里需要单独定义图片位置才可以，假设图片大小是200*100

CSS的定义：#logo{width:500px; height:300px;}#logo img{margin-top:100px; margin-
right:150px;}

二、在网页设计中怎么让背景图片水平居中

要看清楚哦！
1、背景图片
2、水平居中，不是垂直居中。

3、css，js都可以
谢谢咯background:url()no-repeatcentercenter;:no-
repeat为背景图不重复，最好是满足1280宽度的分辨率下位满屏，图片可以宽度为1280像素，第一个center为水平居中，第二个center为垂直居中，第二个center换成top也就是顶部显示背景图。
用CSS即可，也可以在图片的层上加句center即可。
这是最简单的。
点中图片，然后选择位置居中就可以了。
background:url() no-repeat center center;:no-
repeat为背景图不重复，最好是满足1280宽度的分辨率下位满屏，图片可以宽度为1280像素，第一个center为水平居中，第二个center为垂直居中，第二个center换成top也就是顶部显示背景图。
CSS使网页背景图片居中的三种方法。
1、第一种：用像素设定，很多都用这种，但是也是最麻烦的：

2、第二种：用50%设定，很方便。

3、第三种：用center设定（注：第2个center可以省略，因为默认就是center）。

background-image:url(/images/); /背景图片/background-repeat:no-repeat;
/背景图片不重复/background-position:center top; /水平居中，垂直顶对齐/

三、div布局网页时如何设置ul，li横向导航水平居中

答：这个网上有很多教程的，基本上是先清除默认格式，然后给一定的宽度，再设置浮动属性：ulli{list-
style:none;width:200px;float:left;}居中需要父容器设置：margin:auto

四、divcss，图片怎么设置在DIV中垂直居中

div+css，图片设置在DIV中垂直居中:方法一：思路：利用text-align属性将图片水平居中，然后设置padding-
top的值使其垂直居中。结构如下：

CSS样式如下：div {width:300px; height:150px; background-color:#CCC; border:#000 1px
solid; text-align:center; padding-
top:50px;}释义：图片的尺寸为150x100px，DIV的大小为300x200px；background-color:#CCC;
border:#000 1px solid;为DIV加个边框和背景色，便于观察效果。text-align:center,实现图片的水平居中；padding-
top:50px，50px这个数值是经过计算得到的，padding-top的值具体算法如下：（DIV的高度 –
图片的高度）/2，但这里要注意，根据盒模型原理，我们还要将DIV原来的高度200减去padding-
top的值，这样显示的才是正确的，否则DIV会变高。方法二：思路：只用padding属性，通过计算求得居中结构代码同上；CSS样式如下：div
{width:225px; height:150px; background-color:#eee; border:#000 1px solid;
padding-top:50px; padding-
left:75px;}备注：这里DIV的宽高计算都遵循盒模型原理，计算方法同上。方法三：思路：利用图片的margin属性将图片水平居中，利用DIV的padding属性将图片垂直居中。结构代码同上；CSS代码如下：div
{width:300px; height:150px; background-color:#eee; padding-top:50px;
border:#000 1px solid;}img {display:block; margin:0
auto;}备注：Img是内联元素，要设置其margin属性使其居中，就要将其转换为块元素display:block;然后利用margin:0
auto;实现图片的水平居中；（有的设计师为图片再加个div标签，然后通过div标签的margin实现居中