day--16页面布局
Posted （野生程序员）
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了day--16页面布局相关的知识，希望对你有一定的参考价值。
后台页面布局
一、fixed布局
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <!--对body标签执行CSS样式操作 --> <style> body{ margin:0; } .pg-header{ height:48px; background-color:#2459a2; color:white; } .left{ float:left; } .right{ float:right; } .pg-content .menu{ position:fixed; top:48px; left:0; bottom:0; width:200px; background-color:#dddddd; } .pg-content .content{ position:fixed; top:48px; right:0; bottom:0; left:200px; background-color:pink; overflow:auto; } </style> <!-- 上面overflow是滚动条，当内容超过页面的高度之后，定义overflow会出现滚动条，让能够拉动看到下面的内容 --> <!-- 最小宽度，当比例小于最小宽度失效，执行最小宽度 --> <!-- 另外一个移动的边框会受到影响，会出现什么情况 --> </head> <body> <div class="pg-header"></div> <div class="pg-content"> <div class="menu left">a</div> <div class="content left"> <p>alex</p><p>sb</p><p>alex</p><p>sb</p><p>alex</p><p>sb</p><p>alex</p><p>sb</p><p>alex</p><p>sb</p><p>alex</p><p>sb</p> <p>alex</p><p>sb</p><p>alex</p><p>sb</p><p>alex</p><p>sb</p><p>alex</p><p>sb</p><p>alex</p><p>sb</p><p>alex</p><p>sb</p> <p>alex</p><p>sb</p><p>alex</p><p>sb</p><p>alex</p><p>sb</p><p>alex</p><p>sb</p><p>alex</p><p>sb</p><p>alex</p><p>sb</p> <p>alex</p><p>sb</p><p>alex</p><p>sb</p><p>alex</p><p>sb</p><p>alex</p><p>sb</p><p>alex</p><p>sb</p><p>alex</p><p>sb</p> <p>alex</p><p>sb</p><p>alex</p><p>sb</p><p>alex</p><p>sb</p><p>alex</p><p>sb</p> </div> </div> <div class="pg-footer"></div> </body> </html>
以上是关于day--16页面布局的主要内容，如果未能解决你的问题，请参考以下文章
如何通过单击片段内的线性布局从片段类开始新活动？下面是我的代码，但这不起作用