Question

我想包裹横幅，但是在tope下。不幸的是，篡改zindex和位置没有帮助。我不知道如何正确地做。我希望我解释清楚我的意思

＆＃13;

    *{margin:0;padding: 0;border: 0;}
body{text-align: center;}

/*HEADER*/
.content{max-width:980px;margin: auto;height:100%; }
header{width:100%;height:100px;position:fixed;z-index: 5;}
#logo{font-size: 1.1em;font-family: 'Cabin', sans-serif;color:darkgray;float:left;text-transform: uppercase;font-weight: 700;display: inline}
#logo>img{margin-right:10px;margin-top:30px;}
nav{float:right;margin-top:50px;}
nav>ul>li{display:inline;list-style: none; }
nav>ul>li>a{margin-left:10px;text-decoration: none;font-size: 1.0em;font-family: 'Cabin', sans-serif;color:darkgray;text-transform: uppercase;}

.baner{width:100%;height:530px;background: url('baner.png') repeat-x;position:fixed;top:115px;}
.wrap{max-width:100%;margin: auto;top:800px;background: red; position:relative;}

＆＃13;

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <link rel="stylesheet" href="style.css">
    <link href='https://fonts.googleapis.com/css?family=Cabin:700,400' rel='stylesheet' type='text/css'>
</head>
<body>
   <header>
    <div class="content">
    <div id="logo"><img src="logo.png" alt="">Treehouse</div>
    <nav>
        <ul>
            <li><a href="#">Home</a></li>
            <li><a href="#">About</a></li>
            <li><a href="#">Blog</a></li>
            <li><a href="#">Portfolio</a></li>
            <li><a href="#">Contact</a></li>
            
        </ul>
    </nav>
    </div>
    </header>
    <div class="baner">
        <h1></h1>
        <h2></h2>
        <section class="button"></section>
    </div>  
    <div class="wrap">
        
        <p> Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quis, et, repellat. Dicta sunt, eligendi, iusto et eveniet eum enim accusamus dignissimos tempora. Nihil modi, ex veritatis, maxime sequi unde possimus?</p>
         </div>  
    <footer>
        
    </footer>
</body>
</html>

＆＃13;

你能帮帮我吗？

Answer 1

标题必须始终可见，而横幅隐藏在另一种情况下，在这种情况下，＆＃34;包装＆＃34; enter image description here

CSS：我如何在代码中更改位置或索引

1 个答案: