带有居中菜单和徽标的 Wordpress 店面粘性标题

Question

我正在为一位朋友开发 wordpress 项目。不幸的是（对我来说），她认为该网站需要粘性标题，这超出了我对 CSS 的实际理解。我创建了可以帮助我将徽标和菜单置于下方的 css。现在我需要帮助，使其具有粘性并在菜单/导航栏位置之间设置徽标。

页眉屏幕 [1]：https://i.stack.imgur.com/Vg3PF.jpg

a:focus {
 outline: 0; 
}
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300&family=Playfair+Display+SC&display=swap');

/* center logo*/
.site-branding{
width:100% !important;
text-align:center;

}
.site-header .site-branding img {
margin: auto;
margin-top: 50px;
margin-bottom: 30px;
max-width: 300px;

}
/* center menu */
nav#site-navigation {
width: 100%;
text-align: center;
margin-right: 0px;
margin-bottom:55px;
font-size: 24px;
font-family: Playfair Display SC;
}
@media (min-width: 768px){
.woocommerce-active .site-header .site-header-cart {
width: 21.7391304348%;
margin: 0 auto;
float:none;
}
.entry-content{
        font-family: Open Sans;
    }
    .h2 {
        font-family: Playfair Display SC;
    }````

Answer 1

您可以将 sticky 和 ​​position : fixed 用于sticky items。

.sticky {
  position: fixed;
  top: 0;
  width: 100%
}