[js]顶部导航和内容区布局

Posted 毛台

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了[js]顶部导航和内容区布局相关的知识,希望对你有一定的参考价值。

自己实现顶部导航布局--内容显示

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>test</title>
    <style>
        body{
            margin: 0px;
            padding: 0;
        }
        .app{
            height: 400px;
            width: 400px;
            background-color: gray;
            padding-top: 40px;
        }
        .app01{
            width: 400px;
            height: 40px;
            background-color: green;
            position: fixed;
            left: 0;
            top: 0;
        }
    </style>
</head>
<body>
<div class="app">
    <div class="app01">
        头部导航
    </div>
    <div class="content">
        content
    </div>
</div>
</body>
</html>

app内容区布局思路也一样的

以上是关于[js]顶部导航和内容区布局的主要内容,如果未能解决你的问题,请参考以下文章

BootStrap有用代码片段(持续总结)

BootStrap实用代码片段(持续总结)

关于多子级元素充满父级元素高度的布局方式

没有滚动内容时如何下拉协调器布局

web如何将顶部导航栏内容显示在两边位置

片段内容重叠工具栏和底部导航视图