最近在做一个网页,正好需要用到一个嵌套事布局,也就是如果说我要一个分类,在上边填写上简介,下边列出我需要的内容,这样的一个嵌套式布局,这里就把这个例子先引用上。
<!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> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>Bootstrap</title> <link href="file:///E|/视频/09项目知识/界面设置/bootstrap/css/bootstrap.css" rel="stylesheet" type="text/css" /> </head> <body> <div class="container-fluid"> <h1 class="page-header">布局<small>使用BootStrap网格系统布局网页</small></h1> <p>昨日兮昨日,昨日何其好? 春去秋来间,年华终老去。 春去秋来,秋天来了,绿树枯了,来年有再青的时候;冬天来了,燕子去了,有再来的时候;春天去了,梅花谢了,有再开的时候。而流年情薄凉,容易把人抛…</p> <div class="row-fluid"> <div class="span4"> <h2 class="page-header">区块1</h2> <p>昨日兮昨日,昨日何其好? 春去秋来间,年华终老去。春去秋来,秋天来了,绿树枯了,来年有再青的时候;冬天来了,燕子去了,有再来的 时候;春天去了,梅花谢了,有再开的时候。而流年情薄凉,容易把人抛…</P> </div> <div class="span4"> <h2 class="page-header">区块2</h2> <p>昨日兮昨日,昨日何其好? 春去秋来间,年华终老去。春去秋来,秋天来了,绿树枯了,来年有再青的时候;冬天来了,燕子去了, 有再来的时候;春天去了,梅花谢了,有再开的时候。而流年情薄凉,容易把人抛…</P> </div> <div class="span4"> <h2 class="page-header">区块3</h2> <p>昨日兮昨日,昨日何其好? 春去秋来间,年华终老去。春去秋来,秋天来了,绿树枯了,来年有再青的时候; 冬天来了,燕子去了,有再来的时候;春天去了,梅花谢了,有再开的时候。而流年情薄凉,容易把人抛…</P> <div class="row-fluid"> <div class="span6">昨日兮昨日,昨日何其好?</div> <div class="span6">昨日兮昨日,昨日何其好?</div> </div> </div> </div> </div> <script src="../bootstrap/js/bootstrap.min.js"></script> <script src="../bootstrap/js/jquery-1.11.2.min.js"></script> </body> </html>
时间: 2024-10-05 06:52:24