RSS
热门关键字:  命名  body  hack  !mi  !im
当前位置 :| 主页>div+css>基础教程>

DIV CSS网页布局:实现让多个DIV排列时居中

来源:[标签:出处] 作者:[标签:作者] 时间:2008-02-19 点击:



%26lt;?xml version="1.0" encoding="iso-8859-1"?%26gt;
%26lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"%26gt;
%26lt;html xmlns="http://www.w3.org/1999/xhtml"%26gt;
%26lt;head%26gt;
%26lt;title%26gt;Untitled Document%26lt;/title%26gt;
%26lt;meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /%26gt;
%26lt;style type="text/css"%26gt;
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%26gt;body #outer {display:table}/*for mozilla */
html%26gt;body .inner {display:table;float:left}/*for mozilla */
@media all and (min-width: 0px){/* opera 7 styles */
html%26gt;body .inner {display:inline-block;float:none;}
}

%26lt;/style%26gt;
%26lt;/head%26gt;
%26lt;body%26gt;
%26lt;!-- force quirks mode by using the xml pro-logue --%26gt;
%26lt;div id="outer"%26gt;
%26lt;div class="inner"%26gt;test%26lt;/div%26gt;
%26lt;div class="inner"%26gt;2%26lt;/div%26gt;
%26lt;div class="inner"%26gt;3%26lt;/div%26gt;
%26lt;div class="inner"%26gt;4%26lt;/div%26gt;
%26lt;div class="inner"%26gt;5%26lt;/div%26gt;
%26lt;div class="inner"%26gt;6%26lt;/div%26gt;
%26lt;div class="inner"%26gt;7%26lt;/div%26gt;
%26lt;div class="inner"%26gt;8%26lt;/div%26gt;
%26lt;div class="inner"%26gt;9%26lt;/div%26gt;
%26lt;div class="inner"%26gt;10%26lt;/div%26gt;
%26lt;div class="inner"%26gt;11%26lt;/div%26gt;
%26lt;div class="inner"%26gt;12%26lt;/div%26gt;
%26lt;div class="inner"%26gt;13%26lt;/div%26gt;
%26lt;br style="clear:both" /%26gt;
%26lt;/div%26gt;
%26lt;/body%26gt;
%26lt;/html%26gt;
%26lt;script language="Javascript"%26gt;
var now = new Date();
document.write("%26lt;img src='http://counter.yesky.com/counter.shtml?CID=54197%26AID=-1%26refer=" escape(document.referrer) "%26rand=" now.getTime() "%26cur=" escape(document.URL) "' border='0' alt='' width='0' height='0'%26gt;");
%26lt;/script%26gt;
%26lt;noscript%26gt;
%26lt;img src="/Image/200821912351390677802.shtml?CID=54197%26AID=-1%26refer=noscriptcounter%26cur=noscriptcounter" border='0' width='0' height='0'/%26gt;
%26lt;/noscript%26gt;
最新评论共有 0 位网友发表了评论
发表评论
评论内容:不能超过250字,需审核,请自觉遵守互联网相关政策法规。
用户名: 密码:
匿名?
注册
栏目列表