设计实例：实现让多个DIV排列时居中

设计实例：实现让多个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">

　　<head>

　　<title>Untitled Document</title>

　　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>

　　</body>

　　</html>

　　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>

　　——您可以运行代码察看特效，您也可以复制或者另存源代码。

来源：互联网
阅读：次
日期：2010-8-5

【收藏此文】【打印此文】


	主题文章设计实例：实现让多个DIV排列时居中 Div+CSS+JS树型菜单，可刷新 DIV元素和SPAN元素的区别


	推荐内容 DIV元素和SPAN元素的区别 Dreamweaver制作网页技巧20则网页设计的发展历史


	最近更新用Dreamweaver合理为为网页进行优化 CSS教程:背景background属性应用 CSS初级入门：整体布局声明解决列高度自适应(列高度相同)的五种方法最小高度100%页脚保持在底部的布局方法设计实例：实现让多个DIV排列时居中网页特效欣赏：非常酷的角BANNER 设计实例：不同色链接和其下划线设计实例：Hover over下的边框变化设计实例：看看IE中有关1px的Bug CSS网页代码编写技巧：隔行换色的实现 CSS讨论：IE下中英文字体下划线对齐问题雅黑字体对IE显示网页布局的影响可扩展圆角标签的实现方法相册的自动播放效果SlideShow CSS控制文本自动换行 Div+CSS+JS树型菜单，可刷新聚氨酯漆和聚酯漆有什么不同上海品牌网站建设－上海专业的网站建设公司广西移动 www.gx.chinamobile.com


	人气排行辽宁福彩 www.lnlotto.com 河南移动 www.ha.chinamobile.com 广西移动 www.gx.chinamobile.com 黑龙江卫视 www.hljtv.com 河南工业大学 www.zzit.edu.cn 网页设计的发展历史为所有的图片加上Alt属性使用UL列表布局导航菜单在页面head标签中引入所有的样式表文件不要使用嵌入式CSS样式黑龙江信息港 www.hlj.net 一定要闭合HTML标签 DIV元素和SPAN元素的区别 CSS规则层叠时的优先级算法在页面底部引入javascript文件 Dreamweaver制作网页技巧20则声明正确的文档类型( DocType ) 不要随意使用框架不要使用嵌入式JavaScript，这都21世纪了！聚氨酯漆和聚酯漆有什么不同辽宁师范大学 www.lnnu.edu.cn