1 <!DOCTYPE html>
2 <html xmlns="http://www.w3.org/1999/xhtml">
3 <head>
4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
5 <meta name="viewport" content="width=device-width, initial-scale=1">
6 <title></title>
7 <link href="css/demo3.css" rel="stylesheet" />
8 <link href="css/pure-min.css" rel="stylesheet" />
9 <link href="css/grids-responsive-min.css" rel="stylesheet" />
10 </head>
11 <body>
12 <div id="header">头部</div>
13 <div id="mainbody" class="pure-g">
14 <div class=" pure-u-1 pure-u-sm-2-5 pure-u-md-1-5 " id="main-left"><p>左边</p></div>
15 <div class="pure-u-1 pure-u-sm-3-5 pure-u-md-3-5" id="main-center"><p>中间</p></div>
16 <div class="pure-u-1 pure-u-sm-1 pure-u-md-1-5" id="main-right"><p>右边</p></div>
17 </div>
18 </body>
19 </html>
1 *{
2 padding:0px;
3 margin:0px;
4 }
5 #header{
6 width:80%;
7 margin:0px auto;
8 padding:20px 0px;
9 border:solid 1px red;
10 }
11 #mainbody{
12 width:80%;
13 margin:0px auto;
14 }
15
16 #mainbody p{
17 background-color:#ccc;
18 margin:10px;
19 min-height:100px;
20 }
407
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
