當前位置：首頁 > 编程资源 > 编程问答 >内容正文

编程问答

多个DIV排列时居中

發布時間：2024/10/12 编程问答 35 豆豆

生活随笔收集整理的這篇文章主要介紹了多个DIV排列时居中小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

<?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>多个DIV排列时居中 </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}
html>body #outer {display:table}
html>body .inner {display:table;float:left}
@media all and (min-width: 0px){
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>
<script language="Javascript">
var now = new Date();
document.write("<img src='http://counter.yesky.com/counter.shtml?CID=54197&AID=-1&refer="+escape(document.referrer)+"&rand="+ now.getTime()? + "&cur="+escape(document.URL)+"' border='0' alt='' width='0' height='0'>");
</script>
<noscript>
<img src="http://counter.yesky.com/counter.shtml?CID=54197&AID=-1&refer=noscriptcounter&cur=noscriptcounter" border='0' width='0' height='0'/>
</noscript>test 2 3 4 5 6 7 8 9 10 11 12 13

轉載于:https://www.cnblogs.com/nices/p/3397652.html

總結

以上是生活随笔為你收集整理的多个DIV排列时居中的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。

上一篇：在SQLite中使用索引优化查询速度
下一篇：交强险折扣规则