怎么让图片垂直居中

1. div中如何使图片垂直居中

.box {/*非IE的主流浏览器识别的垂直居中的方法*/
display: table-cell;
vertical-align:middle;
/*设置水平居中*/
text-align:center;
/* 针对IE的Hack */
*display: block;
*font-size: 175px;/*约为高度的0.873，200*0.873 约为175*/
*font-family:Arial;/*防止非utf-8引起的hack失效问题，如gbk编码*/
width:200px;
height:200px;
border: 1px solid #eee;}
.box img {/*设置图片垂直居中*/
vertical-align:middle;}

2. 怎样让图片在DIV中垂直居中

例子：<div
class="ac"
style="width:1000px;height:500px;position:relative;
z-index:9;">
<img
width="200px"
height="200px"
style="position:absolute;
top:150px;
left:400px;
z-index:9"
/>
</div>

这里的top和left需要数学天赋了，一般top=外div总高height/2+需要垂直居中内容总高height/2；left同理。

3. 如何让div中的图片垂直居中对齐

分两种情况：
1、图片宽高固定，这种情况很简单。

水平居中：就在图片的css中加 dispaly:block;margin:0 auto;

垂直居中：自己算出（div的高度-图片的高度）/2，得到margin-top值即可。

2、图片高度未知，这个布局比较难实现。一般我是用js做的。

水平居中：同上，在图片的css中加 dispaly:block;margin:0 auto;

垂直居中：用js算出（div的高度-图片的高度）/2，得到margin-top值赋给它。

4. div 怎么让图片垂直居中

比如
<div style="margin:0 auto;text-align:center"><img src="196999_142815071333_2.jpg" /></div>

5. div+css，图片怎么设置在DIV中垂直居中

div+css，图片设置在DIV中垂直居中:
方法一：
思路：利用text-align属性将图片水平居中，然后设置padding-top的值使其垂直居中。
结构如下：
<div>
<img src="images/tt.gif" width="150" height="100" />
</div>
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实现居中

6. css html 如何将图片img标签 水平居中 垂直居中 和水平垂直居中

1、第一种css代码如图所示。display设置成table-cell，text-align为center，垂直居中设置vertical-align为middle。

7. CSS如何实现让图片垂直居中

在一个容器里再定义一个绝对定位的p容器，再在p容器里放需要垂直居中的图片，图片定义相对定位的CSS。 直接上CSS代码：#pic{width:300px; height:300px; background-color:green; border:6pxsolid#ccc; text-align:center; position:relative; display:table-cell; vertical-align:middle;}#picp{*position:absolute;top:50%;left:50%;}#picpimg{*position:relative;top:-50%;left:-50%;}#pic是容器，里面放一个p容器，该容器采用绝对定位，最后插入图片，图片采用相对定位。 这里用到了一个hack,*只有IE浏览器可以识别，Firefox不认识

8. 如何用word使图片上下居中

在图片上右键-设置对象格式，选择图片版式。

图片格式改为四周型或者环绕型，不能用嵌入式。然后直接在图片格式里面选水平居中对齐就行了。图片不能垂直居中。

文字垂直居中：如果没有文本框直接点击工具栏上面的快捷键“居中对齐即可”。此时不存在垂直居中。
如果带文本框：选中内容—右键单击—单元格对齐方式—直接选垂直对齐即可。

9. 怎么才可以使背景图片垂直居中呢

body的background-position:50% 50%,无论browser窗口如何变化背景图的中心与窗口中心重合，但是在FF和opera中，只能实现在水平方向上居中，垂直方向背景图的中心与窗口的上边缘重合。如果把backgrond-position:50% 0%,那水平居中，垂直方向上背景图的上边缘和窗口的上边缘重合，不知道什么理由。另外background-position:center center效果跟年50% 50% 相同

10. html能设置图片水平和垂直居中吗

可以的，水平居中是align=“center” 垂直是valign="middle"，代码实例如下：
<table width="1000px" border="1">
<tr><td align="center"><img src="xx.jpg"></td></tr>
</table>
上面的代码即设置图片水平居中，同理可以设置其垂直居中。