当前位置:首页 > 设计在线 > 网页设计 > CSS/Xhtml > Web标准网页布局:实现让多个DIV排列时居中

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

点击次数:30 次 发布日期:2008-11-26 22:55:55 作者:源代码网
源代码网推荐 <?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>
源代码网推荐<!-- force quirks mode by using the xml pro-logue -->
源代码网推荐<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>
源代码网供稿.
网友评论 (0)
会员中心
设计在线
本站推荐
设计在线之精华