-1
我正在製作一個新網站並使用我喜歡的模板。請注意，我有兩個「關於我們」部分完全相同，現在只是填充，但您可以通過查看網頁圖像來查看截斷的內容。由標題導航部分欄隱藏的內容內容 - bootstrap - css
不知道我需要做些什麼來解決這個正文內容問題的重疊。我嘗試了margin-top填充，固定位置，z-index，但我做錯了什麼。我已經完成了主要網頁，並且我沒有任何主體重疊問題，因爲我在導航所在的頂部標題正下方使用了flexslider。
我一直在嘗試堆棧溢出的許多可能的修復，但我無法解決這個問題。
謝謝！
/*
Compass Template
http://www.templatemo.com/tm-454-compass
http://meyerweb.com/eric/tools/css/reset/
v2.0 | 20110126
License: none (public domain)
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
/*------------------------------------------------------
\t Basic Styling
--------------------------------------------------------*/
body {
font: 13px/23px "Open Sans", sans-serif;
-webkit-font-smoothing: antialiased;
word-wrap: break-word;
color: #777777;
}
a {
-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-ms-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}
input::-moz-focus-inner {
border: 0;
}
a:hover, a:active, a:focus {
text-decoration: none;
outline: none;
}
h1, h2, h3, h4, h5, h6 {
font-family: "Open Sans", sans-serif;
color: #444444;
}
.top-header .right-header ul.social-icons, .main-header .menu ul {
padding: 0;
margin: 0;
list-style: none;
}
#homecontent, #portfolio, #about, #contact, #vinnies, #outreach, #crossroads {
padding-top: 30px;
}
/*------------------------------------------------------
\t Header Styles
--------------------------------------------------------*/
.top-header {
background: #191970;
color: white;
padding: 10px 0;
z-index: 1000
position: fixed
}
.top-header .left-header span {
display: inline-block;
margin: 8px 20px 0 0;
}
.top-header .left-header span i {
margin-right: 10px;
}
.top-header .right-header ul.social-icons li {
display: inline-block;
}
.top-header .right-header ul.social-icons li a {
color: white;
width: 32px;
height: 32px;
text-align: center;
line-height: 30px;
border: 2px solid white;
-webkit-border-radius: 16px;
border-radius: 16px;
margin: 0 8px;
}
.top-header .right-header ul.social-icons li a:hover {
background-color: white;
color: #191970;
}
.main-header {
position: fixed;
width: 100%;
z-index: 9999;
padding: 10px 0;
background: white;
-webkit-box-shadow: 0 2px 4px rgba(1, 1, 1, 0.15) ;
-moz-box-shadow: 0 2px 4px rgba(1, 1, 1, 0.15) ;
box-shadow: 0 2px 4px rgba(1, 1, 1, 0.15) ;
-webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
-ms-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out;
}
.main-header .logo {
margin-top: 2px;
}
.main-header .logo h1 {
font-size: 28px;
font-weight: 700;
text-transform: uppercase;
}
.main-header .logo h1 a {
color: #444444;
}
.main-header .menu {
margin-top: 35px;
}
.main-header .menu ul li {
display: inline-block;
margin-left: 5px;
}
.main-header .menu ul li a {
text-transform: uppercase;
color: #777777;
font-size: 15px;
padding: 8px 15px;
-webkit-border-radius: 3px;
border-radius: 3px;
}
.main-header .menu ul li a.current {
background: #191970;
color: white;
}
.main-header-shrink {
padding: 10px 0;
top: 0;
}
.responsive-menu {
position: relative;
top: -20px;
}
.responsive-menu .toggle-menu {
font-size: 24px;
color: #191970;
}
.responsive-menu .menu {
display: none;
position: absolute;
top: 52px;
width: 100%;
background-color: #191970;
}
.responsive-menu .menu ul li {
display: block;
text-align: left;
border-bottom: 1px solid #d1601c;
margin: 0;
}
.responsive-menu .menu ul li:last-child {
border-bottom: 0;
}
.responsive-menu .menu ul li a {
color: white;
padding: 15px 20px;
display: block;
-webkit-border-radius: 0;
border-radius: 0;
}
.responsive-menu .menu ul li a.current {
background-color: #444444;
}
/*------------------------------------------------------
\t Basic Layout Styles
--------------------------------------------------------*/
.title-section {
margin-bottom: 80px;
}
.title-section h2 {
font-size: 24px;
font-weight: normal;
text-transform: uppercase;
display: block;
margin-bottom: 20px;
}
.title-section span {
display: block;
width: 70px;
height: 4px;
background: #191970;
margin: 0 auto;
}
.widget-title {
font-size: 18px;
font-weight: 600;
margin-bottom: 30px;
}
.mainBtn {
background-color: #191970;
color: white;
display: inline-block;
text-transform: uppercase;
padding: 10px 15px;
font-weight: 600;
font-size: 14px;
-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-ms-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}
.mainBtn:hover {
background-color: #444444;
}
/*------------------------------------------------------
\t Specialty Styles
--------------------------------------------------------*/
#portfolio {
padding-bottom: 80px;
margin-top: 100px;
background: #3d3f3f;
}
#portfolio .title-section h2 {
color: white;
}
#portfolio .portfolio-thumb {
overflow: hidden;
position: relative;
margin-bottom: 30px;
}
#portfolio .portfolio-thumb img {
width: 100%;
height: auto;
}
#portfolio .portfolio-thumb .overlay {
opacity: 0;
visibility: visible;
background: rgba(227, 114, 46, 0.9);
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-ms-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}
#portfolio .portfolio-thumb .overlay .inner {
position: absolute;
padding: 20px;
width: 100%;
bottom: 0;
left: 0;
text-align: center;
}
#portfolio .portfolio-thumb .overlay .inner h4 {
font-size: 18px;
margin-bottom: 10px;
}
#portfolio .portfolio-thumb .overlay .inner h4 a {
color: white;
}
#portfolio .portfolio-thumb .overlay .inner span {
font-weight: 300;
color: white;
}
#portfolio .portfolio-thumb:hover .overlay {
opacity: 1;
visibility: visible;
}
/*------------------------------------------------------
\t Home Content Styles
--------------------------------------------------------*/
#homecontent .homecontent-item .homecontent-header .homecontent-description {
padding-bottom: 20px;
clear: both;
}
#homecontent .homecontent-item .homecontent-header i {
color: #191970;
font-size: 24px;
float: left;
margin-right: 25px;
}
#homecontent .homecontent-item .homecontent-header h3 {
font-size: 18px;
text-transform: uppercase;
font-weight: 600;
margin-bottom: 10px;
}
#homecontent .homecontent-description ul.social-icons li {
display: inline-block;
}
#homecontent .homecontent-description ul.social-icons li a {
color: #191970;
width: 32px;
height: 32px;
text-align: center;
line-height: 30px;
border: solid; 1px; #191970;
-webkit-border-radius: 16px;
border-radius: 16px;
margin: 0 8px;
}
#homecontent .homecontent-description ul.social-icons li a:hover {
background-color: #9fff80;
color: #191970;
}
/*------------------------------------------------------
\t About Styles
--------------------------------------------------------*/
#about .progess-bars li .progress {
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
-webkit-border-radius: 0;
border-radius: 0;
background: #e6e6e6;
height: 30px;
margin-bottom: 15px;
}
#about .progess-bars li .progress-bar {
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
line-height: 30px;
background: #191970;
text-transform: uppercase;
}
#about .our-team {
margin-top: 80px;
}
#about .our-team .team-member {
overflow: hidden;
}
#about .our-team .team-member .member-img {
width: 100%;
position: relative;
}
#about .our-team .team-member .member-img img {
width: 100%;
height: auto;
}
#about .our-team .team-member .member-img .overlay {
top: 0;
left: 0;
position: absolute;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.6);
opacity: 0;
visibility: hidden;
-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-ms-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}
#about .our-team .team-member .member-img .overlay .social {
position: absolute;
top: 0;
left: 0;
}
#about .our-team .team-member .member-img .overlay .social li {
display: inline-block;
float: left;
margin-right: 1px;
}
#about .our-team .team-member .member-img .overlay .social li a {
display: block;
color: white;
background-color: rgba(255, 255, 255, 0.2);
width: 40px;
height: 40px;
text-align: center;
line-height: 40px;
}
#about .our-team .team-member .member-img .overlay .social li a:hover {
background-color: rgba(255, 255, 255, 0.4);
}
#about .our-team .team-member .member-img:hover .overlay {
opacity: 1;
visibility: visible;
}
#about .our-team .team-member .inner-content {
background: whitesmoke;
border: 1px solid #d6d6d6;
border-top: 0;
padding: 20px;
}
#about .our-team .team-member .inner-content h5 {
font-size: 18px;
font-weight: 600;
color: #191970;
margin-bottom: 10px;
}
#about .our-team .team-member .inner-content span {
color: #9d9d9d;
margin-bottom: 15px;
display: block;
}
/*------------------------------------------------------
\t Crossroads Styles
--------------------------------------------------------*/
/*------------------------------------------------------
\t Outreach Styles
--------------------------------------------------------*/
/*------------------------------------------------------
\t Crossroads Styles
--------------------------------------------------------*/
/*------------------------------------------------------
\t Contact Styles
--------------------------------------------------------*/
#contact .contact-form .full-row {
width: 100%;
margin-bottom: 20px;
}
#contact .contact-form input, #contact .contact-form textarea {
outline: 0;
display: block;
border: 1px solid #cccccc;
width: 100%;
max-width: 100%;
padding: 8px 10px;
color: #777777;
}
#contact .contact-form label {
display: block;
margin-bottom: 5px;
}
#contact .contact-form input.mainBtn {
display: inline-block;
width: auto;
border: 0;
padding: 10px 15px;
color: white;
}
#contact .map-holder {
padding: 5px;
background-color: white;
border: 1px solid #d6d6d6;
}
#contact .contact-info {
margin-top: 30px;
}
#contact .contact-info span {
margin-top: 20px;
display: block;
font-size: 14px;
}
#contact .contact-info span i {
color: #191970;
font-size: 16px;
margin-right: 12px;
}
.flexslider {
margin-top: 114px;
width: 100%;
max-width: 100%;
min-width: 100%;
overflow: hidden;
}
.flex-direction-nav a {
color: #444444;
width: 40px;
height: 40px;
background-color: white;
-webkit-border-radius: 3px;
border-radius: 3px;
margin: -20px 0 0 0;
text-align: center;
line-height: 40px;
}
.flex-caption {
position: absolute;
top: 39%;
width: 100%;
text-align: center;
z-index: 999;
color: white;
}
.flex-caption h2 {
font-size: 50px;
text-transform: uppercase;
font-weight: 700;
color: white;
margin-bottom: 45px;
}
.flex-caption p {
font-size: 18px;
font-family: 'Droid Serif', serif;
line-height: 28px;
}
.flex-caption span {
background: url(../images/slider-dec.png) no-repeat;
width: 60px;
height: 9px;
display: block;
margin: 30px auto;
}
/*------------------------------------------------------
\t Footer Styles
--------------------------------------------------------*/
.site-footer {
margin-top: 50px;
background-color: #191970;
color: white;
padding: 25px 0;
}
.site-footer p {
margin-top: 10px;
}
.site-footer a {
color: white;
text-align: center;
display: block;
}
.site-footer .go-top {
float: right;
text-transform: uppercase;
}
.site-footer .go-top i {
display: block;
}
/********************************
IPAD LANDSCAPE (1024x768)
********************************/
/********************************
IPAD PORTRAIT (768x1024)
********************************/
@media only screen and (max-width: 960px) {
.flexslider {
margin-top: 100px;
}
.main-header {
padding: 15px 0;
}
.main-header .logo {
margin-top: 20px;
}
.service-item, .team-member {
margin-bottom: 50px;
}
.our-skills {
margin-top: 60px;
}
.flex-caption {
top: 20%;
}
.flex-caption h2 {
font-size: 24px;
margin-bottom: 20px;
}
.flex-caption p {
font-size: 14px;
width: 70%;
margin: 0 auto;
}
.left-header, .right-header {
text-align: center;
}
}
/********************************
IPHONE 4-4S-5 LANDSCAPE (568x320)
********************************/
@media only screen and (max-width: 760px) {
.flex-caption {
display: none !important;
}
.contact-form {
margin-bottom: 60px;
}
.main-header {
height: 60px;
}
.main-header .logo {
margin: 0;
}
.flexslider {
margin-top: 60px;
}
.responsive-menu .menu {
top: 32px;
}
}
/********************************
IPHONE 4-4S-5 PORTRAIT (320x568)
********************************/<!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang="en">
<![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8" lang="en">
<![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9" lang="en"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
<head>
<title>Society of St. Vincent de Paul Plymouth WI - Home</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="templatemo">
<!--
Compass Template
http://www.templatemo.com/tm-454-compass
-->
<meta charset="UTF-8">
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400italic,600italic,400,300,600,700,800' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Droid+Serif:400,700,400italic,700italic' rel='stylesheet' type='text/css'>
\t
<!-- CSS Bootstrap & Custom -->
<link href="bootstrap/css/bootstrap.css" rel="stylesheet" media="screen">
<link rel="stylesheet" href="css/font-awesome.min.css">
<link rel="stylesheet" href="css/templatemo-misc.css">
<link rel="stylesheet" href="css/animate.css">
<link rel="stylesheet" href="css/templatemo-main.css">
<!-- Favicons -->
<link rel="shortcut icon" href="images/ico/favicon.ico">
<!-- JavaScripts -->
<script src="js/jquery-1.10.2.min.js"></script>
<script src="js/modernizr.js"></script>
<!--[if lt IE 8]>
\t <div style=' clear: both; text-align:center; position: relative;'>
<a href="http://www.microsoft.com/windows/internet-explorer/default.aspx?ocid=ie6_countdown_bannercode"><img src="http://storage.ie6countdown.com/assets/100/images/banners/warning_bar_0000_us.jpg" border="0" alt="" /></a>
</div>
<![endif]-->
</head>
<body>
<div id="header">
<div class="site-header">
<div class="top-header">
<div class="container">
<div class="row">
<div class="col-md-6 col-sm-6">
<div class="left-header">
<span><i class="fa fa-phone"></i>920-892-4913</span>
<span><i class="fa fa-envelope"></i><a href="mailto:[email protected]">[email protected]</a></span>
\t \t \t \t \t \t \t \t <span><i class="fa fa-clock-o"></i>M-F 9AM-7PM SAT 9AM-5PM</span>
</div> <!-- /.left-header -->
</div> <!-- /.col-md-6 -->
<div class="col-md-6 col-sm-6">
<div class="right-header text-right">
<ul class="social-icons">
<li><a href="https://www.facebook.com/?q=#/svdpplymouth" class="fa fa-facebook"></a></li>
<li><a href="https://www.instagram.com/svdpply/" class="fa fa-instagram"></a></li>
\t \t \t \t \t \t \t \t \t <li><a href="https://www.pinterest.com/svdpplymouth/" class="fa fa-pinterest"></a></li>
<li><a href="https://twitter.com/svdp_ply" class="fa fa-twitter"></a></li>
<li><a href="https://www.youtube.com/my_videos?o=U" class="fa fa-youtube"></a></li>
</ul>
</div> <!-- /.left-header -->
</div> <!-- /.col-md-6 -->
</div> <!-- /.row -->
</div> <!-- /.container -->
</div> <!-- /.top-header -->
<div class="main-header">
<div class="container">
<div class="row">
<div class="col-md-4 col-sm-4 col-xs-6">
<div class="logo">
<h1><img src="images/SVDPlogotitle.png"></h1>
</div> <!-- /.logo -->
</div> <!-- /.col-md-4 -->
<div class="col-md-8 col-sm-8 col-xs-6">
<div class="menu text-right hidden-sm hidden-xs">
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="about.html">About</a></li>
\t \t \t \t \t \t \t \t \t <li><a href="store.html">Vinnies</a></li>
\t \t \t \t \t \t \t \t \t <li><a href="outreach.html">Outreach</a></li>
<li><a href="crossroads.html">CrossRoads</a></li>
\t \t \t \t \t \t \t \t \t <li><a href="contact.html">Contact</a></li>
</ul>
</div> <!-- /.menu -->
\t \t \t \t \t \t </div> <!-- /.col-md-4 -->
</div> <!-- /.col-md-8 -->
</div> <!-- /.row -->
<div class="responsive-menu text-right visible-xs visible-sm">
<a href="#" class="toggle-menu fa fa-bars"></a>
<div class="menu">
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="about.html">About</a></li>
\t \t \t \t \t \t \t \t <li><a href="store.html">Vinnies</a></li>
<li><a href="outreach.html">Outreach</a></li>
<li><a href="crossroads.html">CrossRoads</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
</div> <!-- /.menu -->
</div> <!-- /.responsive-menu -->
\t \t \t \t </div> <!-- /.container -->
</div> <!-- /.header -->
</div> <!-- /.site-header -->
</div> <!-- /#home -->
\t
\t
<div id="about" class="section-cotent">
<div class="container">
\t \t \t <div class="row">
\t \t \t \t <div class="col-md-8">
\t \t \t \t \t <h4 class="widget-title">The Society of St. Vincent de Paul</h4>
\t \t \t \t \t <p>Inspired by Gospel values, the Society of St. Vincent de Paul, a Catholic lay organization, leads women and men to join together to grow spiritually by offering person-to-person service to those who are needy and suffering in the tradition of its founder, Blessed Frédéric Ozanam, and patron, St. Vincent de Paul. <br><br>As a reflection of the whole family of God, members, who are known as Vincentians, are drawn from every ethnic and cultural background, age group, and economic level. Vincentians are united in an international society of charity by their spirit of poverty, humility and sharing, which is nourished by prayer and reflection, mutually supportive gatherings and adherence to a basic Rule.<br><br>Organized locally, Vincentians witness God's love by embracing all works of charity and justice. The Society collaborates with other people of good will in relieving need and addressing its causes, making no distinction in those served because, in them, Vincentians see the face of Christ.</p>
\t \t \t \t </div> <!-- /.col-md-3 -->
<div class="col-md-4 vincent-video">
\t \t \t \t \t <iframe width="420" height="315"
\t \t \t \t \t src="http://www.youtube.com/embed/zrwez_neJT4" frameborder="0" allowfullscreen>">
\t \t \t \t \t </iframe>
\t \t \t \t </div> <!-- /.col-md-3 -->
\t \t \t </div> <!-- /.row --> \t
\t \t </div> <!-- /.container top -->
\t </div> <!-- /$about -->
\t
\t
\t
<div id="about" class="section-cotent">
<div class="container">
<div class="row">
<div class="col-md-8">
<h4 class="widget-title">The Society of St. Vincent de Paul</h4>
<p>Inspired by Gospel values, the Society of St. Vincent de Paul, a Catholic lay organization, leads women and men to join together to grow spiritually by offering person-to-person service to those who are needy and suffering in the tradition of its founder, Blessed Frédéric Ozanam, and patron, St. Vincent de Paul. <br><br>As a reflection of the whole family of God, members, who are known as Vincentians, are drawn from every ethnic and cultural background, age group, and economic level. Vincentians are united in an international society of charity by their spirit of poverty, humility and sharing, which is nourished by prayer and reflection, mutually supportive gatherings and adherence to a basic Rule.<br><br>Organized locally, Vincentians witness God's love by embracing all works of charity and justice. The Society collaborates with other people of good will in relieving need and addressing its causes, making no distinction in those served because, in them, Vincentians see the face of Christ.</p>
</div> <!-- /.col-md-3 -->
<div class="col-md-4 vincent-video">
\t \t \t \t \t <iframe width="420" height="315"
\t \t \t \t \t src="http://www.youtube.com/embed/zrwez_neJT4" frameborder="0" allowfullscreen>">
\t \t \t \t \t </iframe>
</div> <!-- /.col-md-3 -->
</div> <!-- /.row --> \t
\t \t </div> <!-- /.container -->
\t </div> <!-- /$about -->
\t
\t
<div class="site-footer">
<div class="container">
<div class="row">
<div class="col-md-8 col-sm-8 col-xs-12">
<p>Copyright © 2016 Society of St. Vincent de Paul Plymouth WI</p>
</div> <!-- /.col-md-6 -->
<div class="col-md-4 col-sm-4 col-xs-12">
<div class="go-top">
<a href="#" id="go-top">
<i class="fa fa-angle-up"></i>
Back to Top
</a>
</div>
</div> <!-- /.col-md-6 -->
</div> <!-- /.row -->
</div> <!-- /.container -->
</div> <!-- /.site-footer -->
<script src="bootstrap/js/bootstrap.min.js"></script>
<script src="js/plugins.js"></script>
<script src="js/jquery.lightbox.js"></script>
<script src="js/custom.js"></script>
<script type="text/javascript">
function initialize() {
var mapOptions = {
\t \t \t scrollwheel: false,
zoom: 15,
center: new google.maps.LatLng(13.758468,100.567481)
};
var map = new google.maps.Map(document.getElementById('map-canvas'),
mapOptions);
}
function loadScript() {
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = 'https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&' +
'callback=initialize';
document.body.appendChild(script);
}
window.onload = loadScript;
</script>
</body>
</html>
謝謝！這工作。還有一件事正在進行。當我現在向下滾動頁面時，您可以看到正文內容滾動到固定徽標/導航標題的頂部。我不知道該怎麼辦？ – hugsnat
@hugsnat我不知道你想說什麼。 – ketan
我將附上網頁上發生的事件的屏幕截圖。當我向下滾動網頁內容時，內容將滾動到我的徽標和導航所在的固定標題的頂部。 – hugsnat