如何讓圖片相對(duì)于上層DIV始終保持水平、垂直都居中
發(fā)布時(shí)間:2013-08-12 17:56:17 作者:佚名
我要評(píng)論

正如標(biāo)題所言圖片與上層的div保持水平、垂直都居中,網(wǎng)上會(huì)搜索到很多類似標(biāo)題的文章,不過大同小異,本文寫了一個(gè)希望對(duì)大家有所幫助
復(fù)制代碼
代碼如下:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>使圖片相對(duì)于上層DIV始終水平、垂直都居中</title>
<style type="text/css">
.thumbBox {width:260px; height:260px; text-align:center; vertical-align:middle; display:table-cell; border:1px solid red;}
</style>
</head>
<body>
使圖片相對(duì)于上層DIV始終水平、垂直都居中
<p>示例一</p>
<div class="thumbBox">
<img src="http://www.baidu.com/img/bdlogo.gif" >
</div>
<p>示例二</p>
<div class="thumbBox">
<img src="http://y2.ifengimg.com/mappa/2013/06/03/cb32ecdc7d0def4d123ae4c38c50050b.jpg" >
</div>
</body>
</html>
相關(guān)文章
- 這篇文章主要介紹了DIV或者DIV里面的圖片水平與垂直居中的方法,需要的朋友可以參考下2018-11-15
DIV+CSS中讓布局、背景圖片、文字內(nèi)容居中的方法
這篇文章主要為大家介紹了在DIV+CSS布局的頁(yè)面里,讓布局、背景圖片、文字內(nèi)容居中的方法,從布局內(nèi)容到頁(yè)面里文章文字居中都是非常重要的,而css來(lái)設(shè)置居中也是非常簡(jiǎn)單的2014-10-09- 這篇文章主要介紹了在不定寬高的情況下,div內(nèi)圖片如何垂直居中,css樣式如何書寫?示例代碼如下2014-07-09
- 讓圖片在div容器里上下左右居中,在實(shí)際應(yīng)用中是很常見的,下面為大家演示個(gè)示例,希望對(duì)大家有所幫助2013-08-02
- 關(guān)于圖片垂直居中的話題想必大家在論壇或者是百度搜索列表中看到了不少了吧,煩人的是沒有具體或者相當(dāng)詳細(xì)的解決方法,希望本文所整理的知識(shí)點(diǎn)可以幫助到你2013-03-22
- 2009-06-19
如何實(shí)現(xiàn)div 圖片在DIV內(nèi)水平居中
本文介紹了div 圖片如何在DIV內(nèi)水平居中,無(wú)論文字居中、圖片居中等內(nèi)容居中我們都可以使用以上兩種方法實(shí)現(xiàn),一般推薦使用CSS進(jìn)行,但網(wǎng)頁(yè)多時(shí)候,我們只需要修改CSS文件2021-11-30最新評(píng)論