CSS代码：如何实现让多个DIV排列时居中

网页特效

网站首页菜单导航日期时间背景图像图层样式鼠标键盘页面窗口色彩表格链接文字表单按钮计数转换游戏娱乐综合实例

您的位置: 网页特效 -> 图层样式 -> CSS代码：如何实现让多个DIV排列时居中

CSS代码：如何实现让多个DIV排列时居中

作者:CSS代码：如何实现让多个DIV排列时居中发布时间:2007-11-13 14:05:13 发布人: admin

<?xml version="1.0" encoding="iso-8859-1"?>
<!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>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
<style type="text/css">
body {text-align:center}
#outer {
	width:60%;
	background:#ffffcc;
	margin:auto;
	text-align:center;
}
.inner {
	width:100px;
	height:100px;
	margin:5px; 
	border:1px solid #000;
}
* html .inner {display:inline}/* for ie*/
html>body #outer {display:table}/*for mozilla */
html>body .inner {display:table;float:left}/*for mozilla */
@media all and (min-width: 0px){/* opera 7 styles */
html>body .inner {display:inline-block;float:none;}
}

</style>
</head>
<body>

<div id="outer"> 
  <div class="inner">test</div>
  <div class="inner">2</div>
  <div class="inner">3</div>
  <div class="inner">4</div>
  <div class="inner">5</div>
  <div class="inner">6</div>
  <div class="inner">7</div>
  <div class="inner">8</div>
  <div class="inner">9</div>
  <div class="inner">10</div>
  <div class="inner">11</div>
  <div class="inner">12</div>
  <div class="inner">13</div>
  <br style="clear:both"/>
</div>
</body>
</html>
<a href="http://web.archive.org/web/20120731024922/http://js.jz123.cn/">欢迎访问中国建站之家网页特效集</a>

CSS代码：如何实现让多个DIV排列时居中

将本文收藏到QQ书签与更多好友分享

上一篇：文章：CSS代码：Hover over下的边框变化下一篇：文章：CSS代码：看看IE中有关1px的Bug网页特效代码

网页特效

CSS代码：如何实现让多个DIV排列时居中

本类浏览排行 »

本站推荐文章 »