我有一个小问题。我的固定标题是透明的，如果我向下滚动，我网站上的内容会高于标题。但我希望标题超越内容，任何人都可以帮助我吗？
红色框应该是标题，绿色框是您可以看到文本和图片通过标题的内容：
My Header.php
* {
margin: 0;
padding: 0;
}
#header {
background-color: #F9F6F3;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100px;
}<div id="header">
<header id="fh5co-header" role="banner">
Here are the Header Text and the Logo
</header>
</div>
答案 0 :(得分：0)
我没有收到此错误 - 对我而言，内容始终位于示例中的标题后面。
但是，您可以确保使用＆＃34; z-index＆＃34;来避免此问题，这是一个css标记，用于决定什么是前面的内容。
在下面的例子中，我给你的标题提供了一个10的z索引，这意味着它应该在任何没有z索引的内容之前，比如内容。
<!DOCTYPE html>
<!--[if gt IE 8]><!-->
<html class="no-js">
<!--<![endif]-->
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>TitleT</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="" />
<meta name="keywords" content="" />
<meta name="author" content="" />
<!-- Facebook and Twitter integration -->
<meta property="og:title" content="" />
<meta property="og:image" content="" />
<meta property="og:url" content="" />
<meta property="og:site_name" content="" />
<meta property="og:description" content="" />
<meta name="twitter:title" content="" />
<meta name="twitter:image" content="" />
<meta name="twitter:url" content="" />
<meta name="twitter:card" content="" />
<!-- Place favicon.ico and apple-touch-icon.png in the root directory -->
<!-- <link rel="shortcut icon" href="favicon.ico"> -->
<link rel="stylesheet" href="css/animate.css">
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/icomoon.css">
<link rel="stylesheet" href="css/owl.carousel.min.css">
<link rel="stylesheet" href="css/owl.theme.default.min.css">
<link rel="stylesheet" href="css/style.css">
<script src="js/modernizr-2.6.2.min.js"></script>
</head>
<body class="boxed">
<div id="wrap">
<div id="fh5co-page">
<style>
* {
margin: 0;
padding: 0;
}
#header {
background-color: #F9F6F3;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100px;
z-index: 10;
}
</style>
<div id="header">
<header id="fh5co-header" role="banner">
<div class="container">
<a href="#" class="js-fh5co-nav-toggle fh5co-nav-toggle dark"><i></i></a>
<div id="fh5co-logo">
<a href="/"><img src="images/logo.png" height="50" width="95" alt=""></a>
</div>
<nav id="fh5co-main-nav" role="navigation">
<ul>
<li><a href="about">sdf</a></li>
<li class="has-sub">
<div class="drop-down-menu">
<a href="services.html">dfgdfg</a>
<div class="dropdown-menu-wrap">
<ul>
</ul>
</div>
</div>
</li>
<li><a href="portfolio.html">asd</a></li>
<li class="has-sub">
<div class="drop-down-menu">
<a href="#">gzu</a>
<div class="dropdown-menu-wrap">
<ul>
<li><a href="quotation">Ser</a></li>
</ul>
</div>
</div>
</li>
<li class="cta"><a href="contact">Contact</a></li>
</ul>
</nav>
</div>
</header>
</div>
<br>
<br>
<div id="fh5co-intro" class="fh5co-section">
<div class="container">
<div class="row row-bottom-padded-sm">
<div class="col-md-8 col-md-offset-2 text-center ts-intro">
<h1>About Us</h1>
</div>
</div>
<div class="row row-bottom-padded-sm">
<div class="col-md-8" id="fh5co-content">
<h2>History</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Temporibus possimus, quaerat tenetur quos ad nostrum eaque esse, ex blanditiis deleniti accusantium molestias perferendis odio, iste cum. Hic eius, ullam repellendus. Possimus, ratione?
Qui, tempora, eveniet! Eveniet facilis nesciunt commodi nostrum!</p>
<p>Illum provident, rerum hic porro doloremque alias voluptatibus fugit aliquam aspernatur molestiae debitis fuga, expedita vel animi eius, ab natus in enim repellendus harum! Est atque quae aut? Sint quis expedita illo placeat ad saepe hic
quidem dolore laboriosam? Sapiente.</p>
<p>Similique sint consequuntur cum ea quia placeat aliquid blanditiis atque, et earum sit sequi. Earum dignissimos omnis, hic atque ducimus quibusdam eos, exercitationem cum ea ipsum, est animi nesciunt. Consequuntur molestias ratione asperiores
sequi nam minima dignissimos voluptas consequatur nemo.</p>
<p>Ut sit repellat id dignissimos excepturi recusandae reprehenderit eius, voluptatem et ab quos qui sequi rem sapiente, delectus numquam officiis. Maxime aliquam unde eum quo, sit qui voluptatum odio nam. Iste vitae, sed enim facilis suscipit
quis obcaecati quas, nobis.</p>
<p>Cupiditate commodi velit officia quidem dolores incidunt, deserunt nam quaerat aliquam labore iure quam. Exercitationem tempora itaque error odio quasi quas illo consequatur nisi debitis, aliquam magnam voluptas, quia, impedit, architecto
fugit suscipit officia ullam laudantium sit libero excepturi deserunt.</p>
</div>
<div class="col-md-4" id="fh5co-sidebar">
<div class="fh5co-service text-left">
<img src="images/slider_2.jpg" class="img-responsive img-bordered" alt="Free HTML5 Bootstrap Template by FreeHTML5.co">
<h3>WDesign</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Pariatur ullam unde, totam harum laboriosam dolores.</p>
<ul class="ul_style_1">
</ul>
</div>
</div>
</div>
<div class="row row-bottom-padded-sm">
<div class="col-md-6">
<p><img src="images/slider_3.jpg" alt="Free HTML5 Bootstrap Template" class="img-responsive img-bordered"></p>
</div>
<div class="col-md-6 padded-top">
<h3>Creative Title Here</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsum fuga rerum doloremque dolore, molestias eligendi. Nulla aliquam aut doloribus tenetur repellendus omnis dicta, unde magni.</p>
<ul class="ul_style_1">
</ul>
</div>
</div>
</div>
</div>
<footer id="fh5co-footer" role="contentinfo">
<div class="container">
<div class="row row-bottom-padded-sm">
<div class="col-md-4 col-sm-12">
<div class="fh5co-footer-widget">
<h3>About Us</h3>
</div>
</div>
<div class="col-md-3 col-md-push-1 col-sm-12 col-sm-push-0">
<div class="fh5co-footer-widget">
<h3>Quick Links</h3>
<ul class="fh5co-footer-link">
</ul>
</div>
</div>
<div class="col-md-3 col-md-push-2 col-sm-12 col-sm-push-0">
<div class="fh5co-footer-widget">
<h3>Follow us</h3>
<ul class="fh5co-social">
</ul>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
</div>
</div>
</div>
</footer>
</div>
</div>
<center>
<center><small class='block'><font size='3'>© 2015-2018 by <a href='https://auszdgfuzasdfg.com'></font></small></center>
</center>
</body>
</html>