DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> CSS入門知識 >> CSS進階教程 >> CSS教程:網頁圖片垂直居中實例<span></span>方法
CSS教程:網頁圖片垂直居中實例<span></span>方法
編輯:CSS進階教程     

破洛洛文章簡介:CSS教程:網頁圖片垂直居中實例.

找到一個不錯的圖片垂直居中代碼!代碼貼上來。

最近做項目發現這個方法有的時候不管用,於是查資料,問高手,在小魔博客裡找到一種方法,描述的不太詳細,把我的代碼發上來。

<!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" xml:lang="zh-cn" lang="zh-cn">
 
<head>
 
<title>Title</title>
 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 
<meta http-equiv="Content-Language" content="zh-CN" />
 
<meta name="author" content="mxclion" />
 
<script type="text/javascript">
 
/* <![CDATA[ */
 

/* ]]> */
 
</script>
 
<style type="text/css">
 
        .a{width:300px; height:350px; line-height:350px; border:1px solid #000; background: #f00; text-align:center;}
 
        .a img{vertical-align:middle;}
 
        .a span{display:inline-block;}
 
</style>
 
</head>
 
<body>
 
        <div class="a">
 
                <img src="images/sy.gif" alt="" />
 
                <span></span>
 
        </div>
 
</body>
 
</html>

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved