【
繁体中文
】
【
设为首页
】
【
加入收藏
】
首页
系统
设计
网络
时尚
探索
网速测试
智商测试
论坛
网络首页
|
网页制作
|
网站建设
|
搜索
推荐
公告
推荐文章
·
CSS样式 14个高级技巧精选
·
一行代码杜绝iframe挂马
·
css如何控制页面居中
·
与表格边框有关的CSS语法
·
多个CSS样式表争夺特定选...
·
XHTML入门学习教程:框架...
·
DIV+CSS布局实例:各种2栏...
·
左中右3栏布局中最先显示...
·
最小高度100%页脚保持在...
·
CSS初级入门(1)：整体布...
热点文章
广告
当前位置：
网络首页
>>
网页制作
>>
html/css
>> CSS+DIV设计实例：实现让多个DIV排列时居中
CSS+DIV设计实例：实现让多个DIV排列时居中
2008-01-08 09:23:58 作者： 来源：互联网 浏览次数：
4
文字大小：【
大
】【
中
】【
小
】
关键字：
实例
CSS+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>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> <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>
运行代码
复制代码
另存代码
发表评论
加入收藏
告诉好友
打印本页
关闭窗口
返回顶部
相关文章
